Search Flex Samples

Drawing transparent pie wedges in a Flex PieChart control

The following example shows how you can create transparent wedges in a Flex PieChart control by setting the SolidColor object’s alpha property to 0, as seen in the following snippet:




<mx:PieChart dataProvider="{arrColl}" height="100%" width="100%">

<mx:series>

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

<mx:fills>

<mx:SolidColor alpha="0.0" />

<mx:SolidColor color="haloBlue" alpha="1.0" />

</mx:fills>

<mx:filters>

<mx:Array />

</mx:filters>

</mx:PieSeries>

</mx:series>

</mx:PieChart>

Full code after the jump.


View MXML


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

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

layout="vertical"

verticalAlign="middle"

backgroundColor="white">



<mx:ArrayCollection id="arrColl">

<mx:source>

<mx:Array>

<mx:Object label="Product 1" data="4" />

<mx:Object label="Product 2" data="27" />

</mx:Array>

</mx:source>

</mx:ArrayCollection>



<mx:PieChart id="pieChart"

dataProvider="{arrColl}"

height="100%"

width="100%"

showDataTips="true">

<mx:series>

<mx:PieSeries id="pieSeries"

field="data">

<mx:fills>

<mx:SolidColor alpha="0.0" />

<mx:SolidColor color="haloBlue" alpha="1.0" />

</mx:fills>

<mx:filters>

<mx:Array />

</mx:filters>

</mx:PieSeries>

</mx:series>

</mx:PieChart>

</mx:Application>

10:49 AM | Labels: , |

This entry was posted on 10:49 AM and is filed under Flex Controls Samples , Flex with Chart Examples . You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

 

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)

Related Flex Samples

Loading...

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples