使用已经存在的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>