天天看點

FLEX 3.0 DataGrid & PieChart with XML

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

 <mx:Script>

  <![CDATA[

     [Bindable]

     public var xmlTest:XML=<BOOKCollection>

            <BookItem>

                <Name>Thinking In Java</Name>

                <Type>JAVA</Type>

                <Count>100</Count>

            </BookItem>  

            <BookItem>

                <Name>Thinking In C++</Name>

                <Type>C++</Type>

                <Count>200</Count>

            </BookItem>  

            <BookItem>

                <Name>Flex First Step</Name>

                <Type>Flex</Type>

                <Count>200</Count>

            </BookItem>  

        </BOOKCollection>;

  ]]>

 </mx:Script>

 <!-- 圖表 從XML中擷取填充資料 注意:XML節點名區分大小寫 -->

 <mx:HBox x="22.25" y="177" width="589.5" height="284">

  <mx:DataGrid height="270" dataProvider="{xmlTest.BookItem}" width="257">

   <mx:columns>

    <mx:DataGridColumn headerText="NAME" dataField="Name"/>

    <mx:DataGridColumn headerText="COUNT" dataField="Count"/>

   </mx:columns>

  </mx:DataGrid>

  <!-- 餅圖 從XML中擷取填充資料 -->

  <mx:Panel width="320" height="276" layout="absolute" title="CUEPOINT PIE CHART">

   <mx:PieChart x="10" y="0" id="piechart1" dataProvider="{xmlTest.BookItem}" width="100%" height="100%" showDataTips="true">

    <mx:series>

     <mx:PieSeries field="Count" nameField="Name" labelPosition="callout"/>

    </mx:series>

   </mx:PieChart>

   <mx:Legend dataProvider="{piechart1}"/>

  </mx:Panel>

 </mx:HBox>

</mx:Application>

繼續閱讀