I am trying to change the data of a column chart using a
combo box. I am using XML for data.
What I am planing to do is.. the combo box will get "Month"
say January, feb etc and same will reflect on the X axis and the
data related to only the selected month should be shown. Say if
January is selected, the x axis should show "January" and the chart
should show only data related to January.
My XML DATA
--------------------------
<YearlyData>
<Sample month="January" revenue="120" costs="45"
overhead="102" oneTime="23" />
<Sample month="February" revenue="108" costs="42"
overhead="87" oneTime="47" />
<Sample month="March" revenue="150" costs="82"
overhead="32" oneTime="21" />
<Sample month="April" revenue="170" costs="44"
overhead="68" />
<Sample month="May" revenue="250" costs="57"
overhead="77" oneTime="17" />
<Sample month="June" revenue="200" costs="33"
overhead="51" oneTime="30" />
<Sample month="July" revenue="145" costs="80"
overhead="62" oneTime="18"/>
<Sample month="August" revenue="166" costs="87"
overhead="48" />
<Sample month="September" revenue="103" costs="56"
overhead="42" />
<Sample month="October" revenue="140" costs="91"
overhead="45" oneTime="60" />
<Sample month="November" revenue="100" costs="42"
overhead="33" oneTime="67" />
<Sample month="December" revenue="182" costs="56"
overhead="25" oneTime="48" />
<Sample month="May" revenue="120" costs="57"
overhead="30" />
</YearlyData>
My MXML Code
-------------------------------------------------
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"layout="horizontal" initialize="srv.send()">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
var arrBook:ArrayCollection = new ArrayCollection;
function ResHandler(event:ResultEvent)
{
arrBook = event.result.YearlyData.Sample;
cb.dataProvider = arrBook;
ColumnChart1.dataProvider = arrBook;
}
function changeChart()
{
cb.selectedItem = CA.categoryField
}
]]>
</mx:Script>
<mx:HTTPService id="srv" url="dataSheet.xml"
result="ResHandler(event)" />
<mx:ComboBox id="cb" labelField="month"
change="changeChart()"/>
<mx:ColumnChart id="ColumnChart1" width="688">
<mx:horizontalAxis>
<mx:CategoryAxis id="CA" categoryField="month" />
</mx:horizontalAxis>
<mx:series>
<mx:ColumnSeries displayName="revenue 1"
yField="revenue"/>
<mx:ColumnSeries displayName="costs 1"
yField="costs"/>
<mx:ColumnSeries displayName="overhead 1"
yField="overhead"/>
<mx:ColumnSeries displayName="onetime 1"
yField="onetime"/>
</mx:series>
</mx:ColumnChart>
<mx:Legend dataProvider="{ColumnChart1}"/>
</mx:Application>