flex图表数据动态更新效果示例

<?xml version="1.0"?><!-- charts/BasicSeriesSlideEffect.mxml --><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"><mx:Script><!--[CDATA[import mx.collections.ArrayCollection;[Bindable]public var expenses1:ArrayCollection=new ArrayCollection([{Month: "Jan", Income: 2000, Expenses: 1500}, {Month: "Feb", Income: 1000, Expenses: 200}, {Month: "Mar", Income: 1500, Expenses: 500}]);[Bindable]public var expenses2:ArrayCollection=new ArrayCollection([{Month: "Jan", Income: 1200, Expenses: 800}, {Month: "Feb", Income: 2500, Expenses: 300}, {Month: "Mar", Income: 575, Expenses: 490}]);public var year:int=1;public function changeProvider():void{if (year == 2){myChart.dataProvider=expenses1;b1.label="View Second Year Data";lbl.text="First Year Data";year=1;}else{myChart.dataProvider=expenses2;lbl.text="Second Year Data";b1.label="View First Year Data";year=2;}}]]--></mx:Script><!-- Define chart effects --><mx:SeriesSlide id="slideIn"duration="1000"direction="up"/><mx:SeriesSlide id="slideOut"duration="1000"direction="down"/><mx:Panel title="Column Chart with Basic Series Slide Effect" layout="absolute" height="493"><mx:Label id="lbl" text="First Year Data" width="233.5" height="44" fontSize="24" color="#091D96" top="5" right="10"/><mx:ColumnChart id="myChart"dataProvider="{expenses1}"><mx:horizontalAxis><mx:CategoryAxis dataProvider="{expenses1}" categoryField="Month"/></mx:horizontalAxis><mx:verticalAxis><mx:LinearAxis minimum="0" maximum="3000"/></mx:verticalAxis><mx:series><mx:ColumnSeries xField="Month" yField="Income" displayName="Income" showDataEffect="slideIn" hideDataEffect="slideOut"/><mx:ColumnSeries xField="Month" yField="Expenses" displayName="Expenses" showDataEffect="slideIn" hideDataEffect="slideOut"/></mx:series></mx:ColumnChart><mx:Legend dataProvider="{myChart}" bottom="0"/></mx:Panel><mx:Button id="b1" click="changeProvider()" label="View Second Year Data"/></mx:Application>

 

<?xml version="1.0"?><!-- charts/AddItemEffect.mxml --><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"><mx:Script><!--[CDATA[import mx.collections.ArrayCollection;[Bindable]public var items:ArrayCollection=new ArrayCollection([{item: 2000}, {item: 3300}, {item: 3000}, {item: 2100}, {item: 3200}]);public function addDataItem():void{// Add a randomly generated value to// the data provider.var n:Number=Math.random() * 3000;var o:Object={item: n};items.addItem(o);}]]--></mx:Script><!-- Define chart effect --><mx:SeriesSlide id="slideIn"duration="1000"direction="up"/><mx:Panel title="Column Chart with Series Effect"><mx:ColumnChart id="myChart"dataProvider="{items}"><mx:series><mx:ColumnSeries yField="item" displayName="Quantity" showDataEffect="slideIn"/></mx:series></mx:ColumnChart></mx:Panel><mx:Button id="b1" click="addDataItem()" label="Add Data Item"/></mx:Application>