如何将XML设置为Flex中图表的dataProvider？

Question

我想将从Oracle数据库导出的XML显示为图表......

xml具有以下结构：

<ROWSET>
  <ROW>
        <ORDER_ITEMS_ID>1</ORDER_ITEMS_ID>
        <ORDER_ID>1</ORDER_ID>
        <PRODUCT_ID>1</PRODUCT_ID>
        <UNIT_PRICE>1200</UNIT_PRICE>
        <QUANTITY>1</QUANTITY>
  </ROW>
  <ROW>
        <ORDER_ITEMS_ID>2</ORDER_ITEMS_ID>
        <ORDER_ID>7</ORDER_ID>
        <PRODUCT_ID>1</PRODUCT_ID>
        <UNIT_PRICE>1100</UNIT_PRICE>
        <QUANTITY>3</QUANTITY>
  </ROW>

我已经看过许多使用ArrayCollection作为DataProvider的图表示例。 用同样的方法，我试着设置xml。 但没有结果。

能否请您建议如何将XML设置为数据提供者？ （或XMLList或XMLlistcollection）（我在AIR中开发一个小应用程序）

Answer 1

我不知道你的图表是什么意思，但这里是基于元素的值和基于属性的值的XMLList提供程序的简单示例

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               creationComplete="application1_creationCompleteHandler(event)"
               >
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            import mx.binding.utils.BindingUtils;
            import mx.collections.XMLListCollection;
            import mx.events.FlexEvent;
            private var xml1:XML = <ROWSET>
                                        <ROW>
                                            <ORDER_ITEMS_ID>1</ORDER_ITEMS_ID>
                                            <ORDER_ID>1</ORDER_ID>
                                            <PRODUCT_ID>1</PRODUCT_ID>
                                            <UNIT_PRICE>1200</UNIT_PRICE>
                                            <QUANTITY>1</QUANTITY>
                                        </ROW>
                                        <ROW>
                                            <ORDER_ITEMS_ID>2</ORDER_ITEMS_ID>
                                            <ORDER_ID>7</ORDER_ID>
                                            <PRODUCT_ID>1</PRODUCT_ID>
                                            <UNIT_PRICE>1100</UNIT_PRICE>
                                            <QUANTITY>3</QUANTITY>
                                        </ROW>
                                </ROWSET>;

            private var xml2:XML = <ROWSET>
                                            <ROW ORDER_ITEMS_ID="1"
                                                ORDER_ID="1"
                                                PRODUCT_ID="1"
                                                UNIT_PRICE="1200"
                                                QUANTITY="1"
                                            />
                                            <ROW ORDER_ITEMS_ID="2"
                                                ORDER_ID="7"
                                                PRODUCT_ID="1"
                                                UNIT_PRICE="1100"
                                                QUANTITY="3"
                                            />

                                    </ROWSET>;

            [Bindable]
            private var xmlList1:XMLList;
            [Bindable]
            private var xmlList2:XMLList;


            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                xmlList1 = xml1.ROW;
                xmlList2 = xml2.ROW;
            }   

        ]]>
    </fx:Script>


    <s:VGroup>
        <mx:ColumnChart id="chart1" dataProvider="{xmlList1}" showDataTips="true">
            <mx:series>
                <mx:ColumnSeries
                    yField="ORDER_ITEMS_ID"
                    />
                <mx:ColumnSeries
                    yField="ORDER_ID"
                    />
                <mx:ColumnSeries
                    yField="PRODUCT_ID"
                    />
                <mx:ColumnSeries
                    yField="UNIT_PRICE"
                    />
                <mx:ColumnSeries
                    yField="QUANTITY"
                    />              
            </mx:series>
        </mx:ColumnChart>

        <mx:ColumnChart id="chart2" dataProvider="{xmlList2}" showDataTips="true">
            <mx:series>
                <mx:ColumnSeries
                    yField="@ORDER_ITEMS_ID"
                    />
                <mx:ColumnSeries
                    yField="@ORDER_ID"
                    />
                <mx:ColumnSeries
                    yField="@PRODUCT_ID"
                    />
                <mx:ColumnSeries
                    yField="@UNIT_PRICE"
                    />
                <mx:ColumnSeries
                    yField="@QUANTITY"
                    />  
            </mx:series>
        </mx:ColumnChart>       
    </s:VGroup>
</s:Application>

Answer 2

如果你想使用xml文件作为数据提供者，你的文件是这样的

<data>
<result month="Jan-04">
<apple>81768</apple>
<orange>60310</orange>
<banana>43357</banana>
</result>
<result month="Feb-04">
<apple>81156</apple>
<orange>58883</orange>
<banana>49280</banana>
</result>
</data>

你可以这样做

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Model id="results" source="../assets/data.xml"/>
<mx:Panel title="Line Chart">
 <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}"/>     

从任何数据库中检索数据后，您还可以使用php或任何其他类型的服务器端编码将数据呈现为xml。在这种情况下，使用mx：Model的源代码为

源= “HTTP：//localhost/yourproj/data.php”

Answer 3

[Bindable] private var PIE_XML:XML= <RowSet>
                                                <row>
                                                  <category>red</category>
                                                  <other_data>50</other_data>
                                                </row>
                                                <row>
                                                  <category>blue</category>
                                                  <other_data>20</other_data>
                                                </row>
                                                <row>
                                                  <category>green</category>
                                                  <other_data>30</other_data>
                                                </row>
                                                <row>
                                                  <category>gold</category>
                                                  <other_data>30</other_data>
                                                </row>
                                            </RowSet>;

private function init（）：void {

            var newItem:Object;
            for(var i:int=0;i<PIE_XML.row.length();i++)
            {
                newItem=new Object();
                newItem.label=PIE_XML.row[i].category;
                newItem.data=PIE_XML.row[i].other_data;

                _pieChart.addItem(newItem);
            }

}

从上面的代码我们可以将XML转换为数组集合然后我们可以使用数组到图表的数据提供者。 提供的解决方案是http://digitaladwords.com/的一半