How to Set XML as dataProvider for Charts in Flex?

Question

I want to display XML exported from Oracle Database as a chart......

The xml has the following structure :

<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>

I've seen many chart examples using ArrayCollection as DataProvider . using the same way , i tried to set xml . But no results.

Can you please suggest me how to set an XML as dataprovider ? ( or XMLList or XMLlistcollection ) ( i'm developing a small app in AIR )

Answer 1

I have no idea how you mean your chart to look, but here's simple example with XMLList provider for both element based values and attribute based values

<?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>