This tutorial will show you how to create chart programmatically out of an XML file.
Step1 :Create Country.xml with the following data and upload into <src> folder
Country.XML
<main>
<item Country= “USA” Gold=”35″ Silver=”39″ Bronze=”29″/>
<item Country= “China” Gold=”32″ Silver=”17″ Bronze=”14″/>
<item Country= “Russia” Gold=”27″ Silver=”27″ Bronze=”38″/>
</main> |
Step2: Load Country.xml and convert it to XMLList
ColumnSeries: Defines a data series for a ColumnChart control.
CategoryAxis: CategoryAxis class to define a set of labels that appear along an axis of a chart.
ChartDataXML.mxml
| <?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” creationComplete=”createComplete(event)”>
<mx:Script>
<![CDATA[
import mx.charts.CategoryAxis;
import mx.charts.series.ColumnSeries;
import mx.charts.ColumnChart;
private function createComplete(e:Event):void
{
var MainXML:URLLoader=new URLLoader(new URLRequest(“Country.XML”))
MainXML.addEventListener(Event.COMPLETE,LoadCountry)
}
private function LoadCountry(e:Event):void
{
var CL:XML=new XML(e.target.data)
var CountryList:XMLList=new XMLList(CL.item)
var IColumn1:ColumnChart=new ColumnChart();
IColumn1.dataProvider=CountryList
//Setting Horizontal Axis
var xAxis:CategoryAxis=new CategoryAxis()
xAxis.categoryField = “@Country”
IColumn1.horizontalAxis=xAxis;
//Column Serier for Silver
var NS:ColumnSeries = new ColumnSeries();
NS.yField = “@Silver”;
IColumn1.series.push(NS) //Pushing columnseries to the column chart (just like a values been pushed to an array)
//Column Serier for Bronze
var NS:ColumnSeries = new ColumnSeries();
NS.yField = “@Bronze”;
IColumn1.series.push(NS) //Pushing columnseries to the column chart (just like a values been pushed to an array)
//Column Serier for Gold
var NS:ColumnSeries = new ColumnSeries();
NS.yField = “@Gold”;
IColumn1.series.push(NS) //Pushing columnseries to the column chart (just like a values been pushed to an array)
addChild(IColumn1)
}
]]>
</mx:Script>
</mx:Application> |
You typically use the CategoryAxis class to define a set of labels that appear along an axis of a chart
