lineChart

[exclosion]

I got the code fromhttp://whatsmytitletoday.blogspot.com/2008/12/add-and-remove-lineseries-flex.html

The dataProvider are hard code in the mxml itself..
Is there any way that I can retrieve the data from external file (xml)?
I need the dataProvider to be dynamic and not hard code..
I been trying and trying but still cant get it :mad:
Please help!...
Thx..

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
pageTitle="Add and remove lineSeries" backgroundGradientAlphas="[1.0, 1.0]"
backgroundGradientColors="[#FFFFFF, #FFFFFF]">
<mx:Script>
<![CDATA[

import mx.collections.ArrayCollection;
[Bindable]
private var expensesAC:ArrayCollection = new ArrayCollection( [
{ Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 },
{ Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 },
{ Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 },
{ Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 },
{ Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]);


private function updateChart(evt:Event):void
{
if ( evt.currentTarget.selected == true )
{
addToChart(evt.currentTarget.label);
} else {
removeFromChart(evt.currentTarget.label);
}
}

private function addToChart(item:String):void
{
var newLS:LineSeries = new LineSeries();
var newStroke:Stroke = new Stroke();
newStroke.color = strokeColor(item);


newLS.yField = item;
newLS.displayName = item;
newLS.setStyle('form','curve');
newLS.dataProvider = expensesAC;
newLS.setStyle('lineStroke',newStroke);
var tmp:Array = linechart.series;
tmp.push(newLS);
linechart.series = tmp;
linechart.invalidateSeriesStyles();
}

/*You may have noticed the line newLS.setStyle('lineStroke',newStroke);.
This refers to the following method, all it does is assigns a color based on
the button selected.*/
private function strokeColor(item:String):uint
{
switch (item)
{
case 'Amount':
return 0x0000FF;
break;
case 'Profit':
return 0xFF0000;
break;
case 'Expenses':
return 0x00FF00;
break;
default:
return 0x000000;
break;
}
}

//remove method
private function removeFromChart(item:String):void
{
var objToRemoveIndex:int;
for ( var i:int = 0; i < linechart.series.length; i++ )
{
if ( linechart.series[i].yField == item )
{
objToRemoveIndex = i;
}
}

var tmp:Array = linechart.series;
tmp.splice(objToRemoveIndex,1);
linechart.series = tmp;
linechart.invalidateSeriesStyles();
}

// The default series gets added with the CreationComplete method:
private function init():void
{
addToChart('Amount');
Amount.selected = true;
}


]]>
</mx:Script>

<mx:Panel title="LineChart Example" height="500" width="100%" layout="vertical">

<mx:HBox id="choices" horizontalGap="0">
<mx:CheckBox id="Amount" label="Amount" toggle="true" click="updateChart(event)"/>
<mx:CheckBox id="Expenses" label="Expenses" toggle="true" click="updateChart(event)"/>
<mx:CheckBox id="Profit" label="Profit" toggle="true" click="updateChart(event)"/>


</mx:HBox>

<mx:LineChart id="linechart" dataProvider="{expensesAC}" height="80%" width="100%" showDataTips="true" >
<mx:horizontalAxis>
<mx:CategoryAxis categoryField="Month"/>
</mx:horizontalAxis>
<mx:series>
<mx:Array>
<mx:LineSeries yField="month" >
<mx:lineStroke>
<mx:Stroke weight="2"/>
</mx:lineStroke>
</mx:LineSeries>
</mx:Array>
</mx:series>

</mx:LineChart>

<mx:Legend dataProvider="{linechart}" labelPlacement="right" verticalGap="2" direction="horizontal"/>

</mx:Panel>

</mx:Application>