Search Flex Samples

Exploding wedges in a Flex PieChart control

The following example shows how you can explode specific wedges in a PieChart control when the user clicks an item in the chart.




<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">



<mx:Script>

<![CDATA[

import mx.charts.events.ChartItemEvent;



private function pieChart_itemClick(evt:ChartItemEvent):void {

var arr:Array = [];

arr[evt.hitData.chartItem.index] = 0.2;

pieSeries.perWedgeExplodeRadius = arr;

}

]]>

</mx:Script>



<mx:XML id="dp">

<products>

<product label="Product 1" data="3" />

<product label="Product 2" data="1" />

<product label="Product 3" data="4" />

<product label="Product 4" data="1" />

<product label="Product 5" data="5" />

<product label="Product 6" data="9" />

</products>

</mx:XML>



<mx:PieChart id="pieChart"

dataProvider="{dp.product}"

selectionMode="single"

showDataTips="true"

itemClick="pieChart_itemClick(event);"

height="250"

width="100%">

<mx:series>

<mx:PieSeries id="pieSeries" field="@data">

<mx:stroke>

<mx:Stroke color="black" weight="0" />

</mx:stroke>

<mx:filters>

<mx:Array />

</mx:filters>

</mx:PieSeries>

</mx:series>

</mx:PieChart>

</mx:Application>

0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples