Comments on: Creating custom fills in a Flex PieChart control using the fillFunction property

By: Sherafudheen

Sherafudheen — Tue, 04 Oct 2011 05:50:16 +0000

First of all thanks for you all Mr. Cosmos and Peter for your help and i do the thinks based on that.

while going i found a small changes and its also working fine for the dynamic pie series color change.

I used the same

For setting the initial color :

private var pieColor:Array = [0x000000, 0x000000, 0x000000, 0x000000];
———————————
(giving this pieColor as a fill color for my pieSeries like fills=”{pieColor}” ).
———————————

there are 4 combo box in my application say an example :

confidanceValuesList data provider is having a value [0,Empty] and [1,Full]
—————–combo box change event ———-
protected function changeChargeTabCombo(event:IndexChangeEvent):void
{
var selectedItemIndex:int = event.currentTarget.selectedIndex;
switch (selectedItemIndex){
case 1:
pieColor[0] = 0xCE1AC5;
break;
default:
pieColor[6] = 0xFFFFFF;
}
changeColor();
}
———————————–

private function changeColor():void{
// making null need to set the fillFunction again
pieSeries.fillFunction = null;
pieSeries.fillFunction = pieSeries_fillFunc;
}

public function pieSeries_fillFunc(item:ChartItem, index:Number):IFill {
var curItem:PieSeriesItem = PieSeriesItem(item);
return new SolidColor(pieColor[curItem.index], 1.0);
}

this will change the pie series color based on the combo value .. the same can do foe the other 4 combo box,

dynamically we can change the pieSeries color ..

By: Fabian

Fabian — Wed, 01 Sep 2010 20:30:11 +0000

Just found this sample of code and it was exactly what I needed for a test.
Thanks for sharing you flex code.

By: Greg

Greg — Fri, 24 Apr 2009 09:23:02 +0000

How can I create a pie chart that uses dynamic data from ArrayCollection ? (I have a web page that does a cycles between the stats and then on the endState it generates all information in one RichTextEditor and then just add the text information into the DataGrid (3 rows) and now I want to create a pieChart that will use the data from one row and then generate a pieChart.

By: cosmoz

cosmoz — Mon, 21 Jan 2008 11:13:28 +0000

At last, I found another way to modified the fill color in runtime. (For Flex 2.0, if you have 3.0 then it's easier by use fillFunction) The key is to define an Array to store the default color data.(any color) eg.

private var pieColor:Array = [0x000000, 0x000000, 0x000000, 0x000000];

Then set it to PieSeries attributes : fills="{pieColor}" And replace each color in that array through the code!! That's it. One thing is the number of data that I used hasn't change so I'm not sure it will work for dynamic number of data. The code is below is:

private var pieColor:Array = [0x000000, 0x000000, 0x000000, 0x000000];

private function changeColor():void{

pieColor[0] = getColor('red');
	pieColor[1] = getColor('amber');
	pieColor[2] = getColor('green');
	pieColor[3] = getColor('default');
}


private function getColor(color:String):uint {
	trace("--getColor--: "   color);
	switch(color){
		case "red":
			return 0xFF0000;
		case "green":
			return 0x00FF00;
		case "amber":
			return 0xFFCC00;
		default:
			return 0x8800CC;
	}
}

By: cosmoz

cosmoz — Mon, 21 Jan 2008 08:11:12 +0000

Is this ‘fillFunction’ work only for Flex 3.0? And if it is any possible method to do the same in flex 2.0?

I’m looking around the web and can not found the solution for flex 2.0.