Lomadee, uma nova espécie na web. A maior plataforma de afiliados da América Latina



Luiz Henrique de Angeli

luizdeangeli@gmail.com


LineChart - Gráfico

terça-feira, 15 de setembro de 2009



Abaixo um exemplo de utilização do LineChart

LineChart.mxml

<?xml version="1.0"?>
<!-- Simple example to demonstrate the LineChart and AreaChart controls. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

 <mx:Script>
  <![CDATA[

   import mx.collections.ArrayCollection;

   [Bindable]
   private var expensesAC:ArrayCollection = new ArrayCollection( [
    { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 },
    { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 },
    { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 },
    { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 },
    { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]);
  ]]>
 </mx:Script>

 <!-- Define custom colors for use as fills in the AreaChart control. -->
 <mx:SolidColor id="sc1" color="blue" alpha=".3"/>
 <mx:SolidColor id="sc2" color="red" alpha=".3"/>
 <mx:SolidColor id="sc3" color="green" alpha=".3"/>

 <!-- Define custom Strokes. -->
 <mx:Stroke id = "s1" color="blue" weight="2"/>
 <mx:Stroke id = "s2" color="red" weight="2"/>
 <mx:Stroke id = "s3" color="green" weight="2"/>

 <mx:Panel title="LineChart and AreaChart Controls Example"
     height="100%" width="100%" layout="horizontal">

  <mx:LineChart id="linechart" height="100%" width="45%"
       paddingLeft="5" paddingRight="5"
       showDataTips="true" dataProvider="{expensesAC}">

   <mx:horizontalAxis>
    <mx:CategoryAxis categoryField="Month"/>
   </mx:horizontalAxis>

   <mx:series>
    <mx:LineSeries yField="Profit" form="curve" displayName="Profit" lineStroke="{s1}"/>
    <mx:LineSeries yField="Expenses" form="curve" displayName="Expenses" lineStroke="{s2}"/>
    <mx:LineSeries yField="Amount" form="curve" displayName="Amount" lineStroke="{s3}"/>
   </mx:series>
  </mx:LineChart>

  <mx:Legend dataProvider="{linechart}"/>

  <mx:AreaChart id="Areachart" height="100%" width="45%"
       paddingLeft="5" paddingRight="5"
       showDataTips="true" dataProvider="{expensesAC}">

   <mx:horizontalAxis>
    <mx:CategoryAxis categoryField="Month"/>
   </mx:horizontalAxis>

   <mx:series>
    <mx:AreaSeries yField="Profit" form="curve" displayName="Profit" areaStroke="{s1}" areaFill="{sc1}"/>
    <mx:AreaSeries yField="Expenses" form="curve" displayName="Expenses" areaStroke="{s2}" areaFill="{sc2}"/>
    <mx:AreaSeries yField="Amount" form="curve" displayName="Amount" areaStroke="{s3}" areaFill="{sc3}"/>
   </mx:series>
  </mx:AreaChart>

  <mx:Legend dataProvider="{Areachart}"/>

 </mx:Panel>
</mx:Application>



Fonte : http://livedocs.adobe.com/flex/3/langref/mx/charts/LineChart.html

0 comentários:


Submarino.com.br
Submarino.com.br