使用已经存在的xml文件作为flex图表（柱状图饼状图等）的数据源的几种方法
price.xml
程序代码 程序代码
<?xml version="1.0" encoding="UTF-8"?>
<data>
????<result month="1 月">
????????<apple>81768</apple>
????????<orange>60310</orange>
????????<banana>43357</banana>
????</result>
????<result month="2 月">
????????<apple>81156</apple>
????????<orange>58883</orange>
????????<banana>59280</banana>
????</result>
????<result month="3 月">
????????<apple>72768</apple>
????????<orange>63031</orange>
????????<banana>41357</banana>
????</result>
????<result month="4 月">
????????<apple>85156</apple>
????????<orange>54883</orange>
????????<banana>47280</banana>
????</result>
</data>
方法一: 用Model和source获取xml
程序代码 程序代码
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
??<mx:Model id="results" source="price.xml"/>
??<mx:Panel title=" 用Model和source获取xml">
???? <mx:LineChart id="myChart" dataProvider="{results.result}" showDataTips="true">
????????<mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
????????</mx:horizontalAxis>
????????<mx:series>
?????????? <mx:LineSeries yField="banana" displayName="Banana"/>
?????????? <mx:LineSeries yField="apple" displayName="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange"/>
????????</mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>?????
??</mx:Panel>
</mx:Application>
方法二:
将xml数据源转换成Array再作为图表的数据源
程序代码 程序代码
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
????width="100%" height="100%">
??<mx:Script>
???? import mx.utils.ArrayUtil;
??</mx:Script>
??<mx:Model id="results" source="price.xml"/>
??<mx:ArrayCollection id="myAC"?
????????source="{ArrayUtil.toArray(results.result)}"
??/>
??<mx:Panel title=" 将xml转换成Array形式的数据源">
???? <mx:LineChart id="myChart" dataProvider="{myAC}" showDataTips="true">
????????<mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
????????</mx:horizontalAxis>
????????<mx:series>
?????????? <mx:LineSeries yField="banana" displayName="Banana"/>
?????????? <mx:LineSeries yField="apple" displayName="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange"/>
????????</mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>?????
??</mx:Panel>
</mx:Application>
方法三: 用HTTPService来获取xml数据源
程序代码 程序代码
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
????width="100%" height="100%" creationComplete="srv.send()">
??<mx:HTTPService id="srv" url="price.xml"/>
??<mx:Panel title=" 用HTTPService来获取xml数据源">
???? <mx:LineChart id="myChart"?
????????dataProvider="{srv.lastResult.data.result}"
????????showDataTips="true"
???? >
????????<mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
????????</mx:horizontalAxis>
????????<mx:series>
?????????? <mx:LineSeries yField="apple" displayName="Apple" name="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange" name="Orange"/>
?????????? <mx:LineSeries yField="banana" displayName="Banana" name="Banana"/>
????????</mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>?????
??</mx:Panel>???
</mx:Application>
方法四:将HTTPService 获取的数据源转换成ArrayCollection
注意: HTTPService需要 creationComplete="srv.send()"来获取数据源
程序代码 程序代码
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="srv.send()">
??<mx:Script><![CDATA[
???? import mx.collections.ArrayCollection;
???? [Bindable]
???? public var myData:ArrayCollection;
??]]></mx:Script>
??<mx:HTTPService?
???? id="srv"?
???? url="price.xml"?
???? useProxy="false"?
???? result="myData=ArrayCollection(srv.lastResult.data.result)"??/>
??<mx:Panel title="HttpService to ArrayCollection">
???? <mx:LineChart id="myChart" dataProvider="{myData}" showDataTips="true">
????????<mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
????????</mx:horizontalAxis>
????????<mx:series>
?????????? <mx:LineSeries yField="apple" displayName="Apple" name="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange" name="Orange"/>
?????????? <mx:LineSeries yField="banana" displayName="Banana" name="Banana"/>
????????</mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>?????
??</mx:Panel>
</mx:Application>
方法五:Httpservice to xmlListCollection作为数据源
注意: source是srv.lastResult.result,而不是 srv.lastResult.data.result
程序代码 程序代码
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
creationComplete="srv.send()">
??<mx:Script><![CDATA[
???? import mx.utils.ArrayUtil;
??]]></mx:Script>
??<mx:HTTPService id="srv"
????url="price.xml"
????resultFormat="e4x"
??/>
??<mx:XMLListCollection id="myAC"?
????source="{srv.lastResult.result}"
??/>
??<mx:Panel title="Httpservice to xmlListCollection">
???? <mx:LineChart id="myChart" dataProvider="{myAC}" showDataTips="true">
????????<mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
????????</mx:horizontalAxis>
????????<mx:series>
?????????? <mx:LineSeries yField="apple" displayName="Apple" name="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange" name="Orange"/>
?????????? <mx:LineSeries yField="banana" displayName="Banana" name="Banana"/>
????????</mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>?????
??</mx:Panel>
</mx:Application>
