Just as a coding suggestion...you can put expressions inside [] array initializers. So instead of this: var g1:GradientEntry = new GradientEntry (0xFF9900, 0, 1); var g2:GradientEntry = new GradientEntry (0xFFCC00, .20, 1); var g3:GradientEntry = new GradientEntry (0xA35901, .50, 1); var g4:GradientEntry = new GradientEntry (0x2B1500, .85, 1); var g5:GradientEntry = new GradientEntry (0xFFCC00, .95, 1); fill.entries=[g1, g2, g3, g4, g5];
You can do this: fill.entries = [ new GradientEntry(0xFF9900, 0, 1), new GradientEntry(0xFFCC00, .20, 1), new GradientEntry(0xA35901, .50, 1), etc. ]; ________________________________ From: flexcoders@yahoogroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Mark Sent: Thursday, March 22, 2007 5:58 AM To: flexcoders@yahoogroups.com Subject: [flexcoders] Re: small problem with Bar Chart showing days When you're right, you're right! 5 minutes later and I now have a nice gradient fill in my bars. Half a day of "beginGradientFill" and all I had to show for it was.... well, nothing. Thanks Ely! Here's the code if anyone runs into this need ( and please post back if anyone see places for improvements ): package { // import flash.display.Graphics; import flash.geom.Rectangle; import mx.charts.ChartItem; import mx.core.IDataRenderer; import mx.core.UIComponent; import mx.charts.chartClasses.LegendData; import flash.geom.Rectangle; import mx.graphics.GradientEntry; import mx.graphics.LinearGradient; // public class SetItemLength extends UIComponent implements IDataRenderer { // public function SetItemLength ():void { super(); } private var _chartItem:Object; // public function get data():Object { return _chartItem; } public function set data(value:Object):void { if (_chartItem == value) return; // if(value is LegendData) return; _chartItem = ChartItem(value); } override protected function updateDisplayList (unscaledWidth:Number,unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth, unscaledHeight); var rc:Rectangle = new Rectangle(0, 0, width , height ); //var columnColor:uint; var g:Graphics = graphics; var fill:LinearGradient = new LinearGradient (); var g1:GradientEntry = new GradientEntry (0xFF9900, 0, 1); var g2:GradientEntry = new GradientEntry (0xFFCC00, .20, 1); var g3:GradientEntry = new GradientEntry (0xA35901, .50, 1); var g4:GradientEntry = new GradientEntry (0x2B1500, .85, 1); var g5:GradientEntry = new GradientEntry (0xFFCC00, .95, 1); fill.entries=[g1, g2, g3, g4, g5]; fill.angle = 90; // g.clear(); g.moveTo(rc.left,rc.top); // Only if the _chartItem has data if (_chartItem == null) return; // Only if the _chartItem has the attributes if(_chartItem.item.hasOwnProperty ("startDate") && _chartItem.item.hasOwnProperty("endDate")){ // if (String (_chartItem.item.startDate) == String(_chartItem.item.endDate)){ //trace("MATCH " + rc.width); rc.width = 2; fill.begin(g, new Rectangle (0, 0, rc.width, rc.height)); } else fill.begin(g, new Rectangle (0, 0, rc.width, rc.height)); } g.lineTo(rc.right,rc.top); g.lineTo(rc.right,rc.bottom); g.lineTo(rc.left,rc.bottom); g.lineTo(rc.left,rc.top); fill.end(g); } } } --- In flexcoders@yahoogroups.com <mailto:flexcoders%40yahoogroups.com> , "Ely Greenfield" <[EMAIL PROTECTED]> wrote: > > > > > Hi Mark. Try using the mx.graphics.LinearGradientFill class. It will > proably make your life much easier than trying to use the graphics > begingradientFill function. > > Ely. > > > ________________________________ > > From: flexcoders@yahoogroups.com <mailto:flexcoders%40yahoogroups.com> [mailto:flexcoders@yahoogroups.com <mailto:flexcoders%40yahoogroups.com> ] On > Behalf Of Mark > Sent: Wednesday, March 21, 2007 1:08 PM > To: flexcoders@yahoogroups.com <mailto:flexcoders%40yahoogroups.com> > Subject: [flexcoders] Re: small problem with Bar Chart showing days > > > > OK, I got the size working, but now I have a new problem. I used a > custom itemRenderer to change the size if the dates are the same. > The code is redrawing the bars with a fill color of red (for now). > I want that solid color to be a gradientFill, but I can't seem to > get it to work at all. When I use the "beginGradientFill" like the > code below all I get is 2 colors without an actual gradiant between > them (and I'm trying for four colors). I tried using the Matrix but > that just confused me more. > > Can someone lend a hand with that part? > > Here's what I have with the solid color -- > > package > { > > import flash.display.Graphics; > import flash.geom.Rectangle; > import mx.charts.ChartItem; > import mx.core.IDataRenderer; > import mx.core.UIComponent; > import mx.charts.chartClasses.LegendData; > //import flash.display.GradientType; > import flash.display.*; > import flash.geom.Matrix; > > public class SetItemLength extends UIComponent implements > IDataRenderer { > // > private var colors:Array = [0xFF9900,0xFFCC00, > 0xA35901, 0x2B1500]; > private var alphas:Array = [1, 1, 1, 1]; > private var ratios:Array = [0, .20, .40, .85]; > // > // > public function SetItemLength ():void { > super(); > } > private var _chartItem:Object; > > public function get data():Object { > return _chartItem; > } > public function set data(value:Object):void { > if (_chartItem == value) > return; > // > if(value is LegendData) > return; > _chartItem = ChartItem(value); > } > override protected function updateDisplayList > (unscaledWidth:Number,unscaledHeight:Number):void { > super.updateDisplayList(unscaledWidth, unscaledHeight); > var rc:Rectangle = new Rectangle(0, 0, width , height ); > var columnColor:uint; > var g:Graphics = graphics; > // > // > g.clear(); > g.moveTo(rc.left,rc.top); > // Only if the _chartItem has data > if (_chartItem == null) > return; > // Only if the _chartItem has the attributes > if(_chartItem.item.hasOwnProperty("startDate") && > _chartItem.item.hasOwnProperty("endDate")){ > // > if (String(_chartItem.item.startDate) == String > (_chartItem.item.endDate)){ > rc.width = 2; > g.beginGradientFill(GradientType.LINEAR, > colors, alphas, ratios); > } else > g.beginGradientFill(GradientType.LINEAR, > colors, alphas, ratios); > } > g.lineTo(rc.right,rc.top); > g.lineTo(rc.right,rc.bottom); > g.lineTo(rc.left,rc.bottom); > g.lineTo(rc.left,rc.top); > g.endFill(); > } > } > } >