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

<fx:Declarations>

<s:RadioButtonGroup id="form" itemClick="eventhandler(event);"/>

</fx:Declarations>

<fx:Script>

import mx.collections.ArrayCollection;

import mx.events.ItemClickEvent;

[Bindable]

public var student:ArrayCollection = new ArrayCollection([

{Stream: "Management", Girls:1000, Boys:1400, TotalStudent:2400},

{Stream: "Computer Science", Girls:800, Boys:1200, TotalStudent:2000},

{Stream: "Mechanical", Girls:200, Boys:1500, TotalStudent:1700},

{Stream: "Electical", Girls:800, Boys:850, TotalStudent:1650},

{Stream: "Electronics", Girls:500, Boys:1000, TotalStudent:1500},

{Stream: "Civil", Girls:300, Boys:900, TotalStudent:1200}

public function eventhandler(event:ItemClickEvent):void{

if(event.currentTarget.selectedValue == "segment"){

cs1.setStyle("form" , "segment");

cs2.setStyle("form" , "segment");

cs3.setStyle("form" , "segment");

}else if(event.currentTarget.selectedValue == "step"){

cs1.setStyle("form" , "step");

cs2.setStyle("form" , "step");

cs3.setStyle("form" , "step");

}else if(event.currentTarget.selectedValue == "vertical"){

cs1.setStyle("form" , "vertical");

cs2.setStyle("form" , "vertical");

cs3.setStyle("form" , "vertical");

}else if(event.currentTarget.selectedValue == "horizontal"){

cs1.setStyle("form" , "horizontal");

cs2.setStyle("form" , "horizontal");

cs3.setStyle("form" , "horizontal");

}else if(event.currentTarget.selectedValue == "reverse"){

cs1.setStyle("form" , "reverseStep");

cs2.setStyle("form" , "reverseStep");

cs3.setStyle("form" , "reverseStep");

}else if(event.currentTarget.selectedValue == "curve"){

cs1.setStyle("form" , "curve");

cs2.setStyle("form" , "curve");

cs3.setStyle("form" , "curve");

</fx:Script>

<s:Panel title="LineChart Control Example" width="724" height="454">

<s:layout>

<s:HorizontalLayout/>

</s:layout>

<mx:LineChart id="linechart1"

paddingBottom="10"

paddingLeft="10"

paddingRight="10"

paddingTop="10"

dataProvider="{student}"

showDataTips="true" width="574"

fontFamily="verdana">

<mx:verticalAxis>

<mx:LinearAxis baseAtZero="true" title="Number of Students" />

</mx:verticalAxis>

<mx:horizontalAxis>

<mx:CategoryAxis categoryField="Stream" dataProvider="{student}" title="B.Tech. Stream"/>

</mx:horizontalAxis>

<mx:series>

<mx:LineSeries id="cs1"

yField="Girls"

xField="Stream"

displayName="Girls">

<mx:lineStroke>

<mx:Stroke color="red" weight="4" alpha="0.6" />

</mx:lineStroke>

</mx:LineSeries>

<mx:LineSeries id="cs2"

yField="Boys"

xField="Stream"

displayName="Boys">

<mx:lineStroke>

<mx:Stroke color="green" weight="4" alpha="0.6" />

</mx:lineStroke>

</mx:LineSeries>

<mx:LineSeries id="cs3"

yField="TotalStudent"

xField="Stream"

displayName="TotalStudent">

<mx:lineStroke>

<mx:Stroke color="blue" weight="4" alpha="0.6" />

</mx:lineStroke>

</mx:LineSeries>

</mx:series>

</mx:LineChart>

<s:VGroup width="141">

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

<s:Label text="Choose Form type" fontFamily="verdana" fontWeight="bold" width="137"/>

<s:RadioButton id="rd1"

groupName="form"

value="segment"

label="Segment"

selected="true"

fontFamily="verdana"/>

<s:RadioButton id="rd2"

groupName="form"

value="step"

label="Step"

fontFamily="verdana"/>

<s:RadioButton id="rd3"

groupName="form"

value="vertical"

label="Vertical"

fontFamily="verdana"/>

<s:RadioButton id="rd4"

groupName="form"

value="horizontal"

label="Horizontal"

fontFamily="verdana"/>

<s:RadioButton id="rd5"

groupName="form"

value="reverse"

label="Reverse Step"

fontFamily="verdana"/>

<s:RadioButton id="rd6"

groupName="form"

value="curve"

label="Curve"

fontFamily="verdana"/>

</s:VGroup>

</s:Panel>