flex柱狀圖，線形圖，餅圖簡單示例

留給自己備用的示例。：）

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:VBox> <mx:Panel width="408" height="480" layout="absolute" horizontalCenter="0" verticalCenter="11" title="柱狀圖"> <mx:ColumnChart id="myChart" dataProvider="{finance}" horizontalCenter="-1" verticalCenter="48" showDataTips="true" width="346" height="330" > <mx:horizontalAxis><!-- 定義橫座標，綁定到“finance”數據庫中的Month上 --> <mx:CategoryAxis dataProvider="{finance}" categoryField="Month" title="(月份)" /> </mx:horizontalAxis> <mx:series><!-- 數據以柱狀的形式顯示 --> <mx:ColumnSeries xField="Month" yField="In" displayName="收入" /><!-- x爲月份，y爲收入 --> <mx:ColumnSeries xField="Month" yField="Out" displayName="支出" /><!--x爲月份，y爲支出 --> <mx:ColumnSeries xField="Month" yField="b" displayName="支b" /><!--x爲月份，y爲支出 --> </mx:series> </mx:ColumnChart> <!-- Legend組件綁定柱狀圖中的數據名 --> <mx:Legend dataProvider="{myChart}" y="40" x="30"/> </mx:Panel> <mx:Panel> <mx:PieChart id="chart" showDataTips="true" width="100%" height="100%" dataProvider="{finance}" innerRadius=".3" horizontalCenter="0" verticalCenter="0"> <mx:series> <mx:Array> <mx:PieSeries nameField="Month" field="In" > </mx:PieSeries> </mx:Array> </mx:series> </mx:PieChart> <mx:Legend dataProvider="{chart}" right="0" bottom="0"/> </mx:Panel> <mx:Panel title=" 用Model和source獲取xml"> <mx:LineChart id="myChart2" dataProvider="{finance}" showDataTips="true"> <mx:horizontalAxis> <mx:CategoryAxis categoryField="month"/> </mx:horizontalAxis> <mx:series> <mx:LineSeries yField="In" displayName="Banana"/> <mx:LineSeries yField="Out" displayName="Apple"/> <mx:LineSeries yField="b" displayName="Orange"/> </mx:series> </mx:LineChart> <mx:Legend dataProvider="{myChart2}"/> </mx:Panel> <mx:Script> <!--[CDATA[ import mx.collections.ArrayCollection; [Bindable] //定義數據集，數據集的內容爲每月的收支情況 public var finance:ArrayCollection = new ArrayCollection( [ {Month:"一月",In:2000,Out:1000,b:3000}, {Month:"二月",In:1000,Out:500,b:1300}, {Month:"三月",In:2500,Out:1100,b:3000}, {Month:"四月",In:3000,Out:1500,b:3000}, {Month:"五月",In:2000,Out:1300,b:300}, {Month:"六月",In:2300,Out:700,b:3000}, {Month:"七月",In:3100,Out:1700,b:3000}, {Month:"八月",In:2300,Out:900,b:3000}, {Month:"九月",In:3200,Out:1600,b:3000}, {Month:"十月",In:2200,Out:600,b:3000}, {Month:"十一月",In:1500,Out:760,b:3000}, {Month:"十二月",In:3500,Out:1000,b:3000}, ]); ]]--> </mx:Script> </mx:VBox> </mx:Application>

 

監聽chart的itemClick事件
返回ChartItemEvent，其中
event.hitSet[0].item.Month
可以取到當前的柱子橫座標的值