Sunday, 11 March 2012

Exploding pie chart


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.charts.events.LegendMouseEvent;
import mx.graphics.Stroke;
[Bindable]
public var expenses:ArrayCollection=new ArrayCollection([
{Expense:"taxes",Amount:2000},
{Expense:"household",Amount:7000},
{Expense:"petrol",Amount:3000},
{Expense:"maintenence",Amount:4000},
{Expense:"vehicle",Amount:10000},
{Expense:"grocery",Amount:1500}
]);

public function alertMe()
{
Alert.show("heyy its great 2 c u here");
}
[Bindable]
 public var explodingArray:Array = [0,0,0,0,0,0];

 private function explodeSlice(event:Event):void{
  explodingArray = [0,0,0,0,0,0];
 explodingArray[event.target.selectedChartItem.index]=0.1;
 piechart1.series[0].perWedgeExplodeRadius = explodingArray;
 expenses.refresh();
 }
]]>
</mx:Script>


<!--<mx:SeriesInterpolate id="interpolate" duration="1000"/>
<mx:PieChart x="144" y="10" id="piechart1" dataProvider="{tuff.lastResult.catalog.GOAL}" showDataTips="true" height="356" itemClick="explodeMe(event)" selectionMode="multiple" width="592">
<mx:series>
<mx:PieSeries labelPosition="insideWithCallout" name="pie chart" displayName="mera_data" field="headcount" dataProvider="{tuff.lastResult.catalog.GOAL}" nameField="Business_unit" perWedgeExplodeRadius="{explodingArray}" showDataEffect="interpolate"/>
</mx:series>
</mx:PieChart> -->


<mx:SeriesInterpolate id="interpolate" duration="1000"/>
<mx:Panel x="0" y="10" width="686" height="506" layout="absolute" title="Exploding Pie Chart">
<mx:PieChart x="105" y="10" id="piechart1" showDataTips="true" itemClick="explodeSlice(event)" selectionMode="multiple" dataProvider="{expenses}">
<mx:series>
<mx:PieSeries labelPosition="callout" displayName="Series 1" field="Amount"  nameField="Expense" perWedgeExplodeRadius="{explodingArray}" showDataEffect="interpolate"/>
</mx:series>
</mx:PieChart>
<mx:Legend dataProvider="{piechart1}" x="10" y="418" width="654" height="27" id="legend1" />
</mx:Panel>
</mx:Application>

1 comment:

  1. output of the above code can be seen here
    http://www.swfcabin.com/open/1331478875

    ReplyDelete