自己写的itemRenderer，实现柱图为圆角矩形。并且根据值的最大最小值用不同的颜色显示在每个柱子的上方。
下面是ItemRenderer代码：
package itemRender
{
import flash.display.Graphics;
import flash.geom.Rectangle;
import mx.charts.ChartItem;
import mx.charts.chartClasses.GraphicsUtilities;
import mx.charts.series.ColumnSeries;
import mx.charts.series.items.ColumnSeriesItem;
import mx.collections.ArrayCollection;
import mx.controls.Text;
import mx.core.IDataRenderer;
import mx.core.UIComponent;
import mx.graphics.IFill;
import mx.graphics.IStroke;
import mx.graphics.SolidColor;
import mx.styles.StyleManager;
import mx.utils.ColorUtil;
public class MyCol extends UIComponent implements IDataRenderer
{
private var _data:Object;
private var l:Text ;
[Inspectable(environment="none")]
/**
* The chartItem that this itemRenderer is displaying.
* This value is assigned by the owning series
*/
public function get data():Object
{
return _data;
}
protected function get showOtherLabel():Boolean{
return true;
}
private function getMMvalue(arr:ArrayCollection,yField:String):Array{
var max:Number=Number.NEGATIVE_INFINITY;
var min:Number=Number.POSITIVE_INFINITY;
for each(var obj:Object in arr){
if(!isNaN(Number(obj[yField]))){
max = Math.max(max,Number(obj[yField]));
min = Math.min(min,Number(obj[yField]));
}
}
return [max,min];
}
protected function get colors():Array{
return ["#008654","#d80000","#B600CC"];
}
private function getColor(max:Boolean=false,min:Boolean=false):String{
var c:String= colors[0];
if(max)
c= colors[1];
else if(min)
c= colors[2];
return c;
}
/**
* @private
*/
public function set data(value:Object):void
{
if (_data == value)
return;
_data = value;
if(value is ColumnSeriesItem){
if(l&&this.contains(l))
this.removeChild(l);
var csi:ColumnSeriesItem = ColumnSeriesItem(_data);
var cs:ColumnSeries = ColumnSeries(csi.element);
var arr:ArrayCollection = cs.dataProvider as ArrayCollection;
var m:Array=getMMvalue(arr,cs.yField);
var max:Boolean = Number(csi.yValue)==m[0];
var min:Boolean = Number(csi.yValue)==m[1];
if(max||min||(arr.length<13&&showOtherLabel)){
l= new Text();
if(max||min)
l.setStyle("fontWeight","bold");
this.addChild(l);
if((value as ColumnSeriesItem).yValue)
l.text= (value as ColumnSeriesItem).yValue.toString();//data label 标签会截掉最后一位，临时处理
l.setStyle("color",getColor(max,min));
l.setStyle("fontSize","14");
}
}
}
//--------------------------------------------------------------------------
//
// Overridden methods
//
//--------------------------------------------------------------------------
/**
* @private
*/
override protected function updateDisplayList(unscaledWidth:Number,
unscaledHeight:Number):void
{
var fill:IFill;
var state:String = "";
if(_data is ChartItem && _data.hasOwnProperty('fill'))
{
state = _data.currentState;
fill = _data.fill;
}
else
fill = GraphicsUtilities.fillFromStyle(getStyle('fill'));
var color:uint;
var adjustedRadius:Number = 0;
switch(state)
{
case ChartItem.FOCUSED:
case ChartItem.ROLLOVER:
if(StyleManager.isValidStyleValue(getStyle('itemRollOverColor')))
color = getStyle('itemRollOverColor');
else
color = ColorUtil.adjustBrightness2(GraphicsUtilities.colorFromFill(fill),-20);
fill = new SolidColor(color);
adjustedRadius = getStyle('adjustedRadius');
if(!adjustedRadius)
adjustedRadius = 0;
break;
case ChartItem.DISABLED:
if(StyleManager.isValidStyleValue(getStyle('itemDisabledColor')))
color = getStyle('itemDisabledColor');
else
color = ColorUtil.adjustBrightness2(GraphicsUtilities.colorFromFill(fill),20);
fill = new SolidColor(GraphicsUtilities.colorFromFill(color));
break;
case ChartItem.FOCUSEDSELECTED:
case ChartItem.SELECTED:
if(StyleManager.isValidStyleValue(getStyle('itemSelectionColor')))
color = getStyle('itemSelectionColor');
else
color = ColorUtil.adjustBrightness2(GraphicsUtilities.colorFromFill(fill),-30);
fill = new SolidColor(color);
adjustedRadius = getStyle('adjustedRadius');
if(!adjustedRadius)
adjustedRadius = 0;
break;
}
var stroke:IStroke = getStyle("stroke");
var w:Number = stroke ? stroke.weight / 2 : 0;
var rc:Rectangle = new Rectangle(w - adjustedRadius, w - adjustedRadius, width - 2 * w + adjustedRadius * 2, height - 2 * w + adjustedRadius * 2);
var g:Graphics = graphics;
g.clear();
g.moveTo(rc.left,rc.top);
if (stroke)
stroke.apply(g);
if (fill)
fill.begin(g,rc);
//圆角矩形
g.drawRoundRect(w - adjustedRadius,
w - adjustedRadius, width - 2 * w + adjustedRadius * 2,
height - 2 * w + adjustedRadius * 2,15);
// g.lineTo(rc.right,rc.top);
// g.lineTo(rc.right,rc.bottom);
// g.lineTo(rc.left,rc.bottom);
// g.lineTo(rc.left,rc.top);
if (fill)
fill.end(g);
if(l){
l.setActualSize(l.textWidth+25,l.textHeight);
l.move(-9,0-l.height);
}
}
}
}
以下是主程序代码：
<?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;
[Bindable]
private var demoArr:ArrayCollection=new ArrayCollection
([{orgName:'杭州',amt:3654},
{orgName:'嘉兴',amt:2000},
{orgName:'绍兴',amt:1000},
{orgName:'金华',amt:1200},
{orgName:'宁波',amt:1800},
{orgName:'台州',amt:560},
{orgName:'丽水',amt:2300},
{orgName:'湖州',amt:2900},
{orgName:'衢州',amt:2600},
{orgName:'温州',amt:1600},
{orgName:'舟山',amt:1300}])
]]>
</mx:Script>
<mx:SeriesInterpolate id="seriesInterpolate" duration="1000" />
<mx:WipeRight id="wipeOut" duration="4000"/>
<mx:WipeRight id="wipeIn" duration="4000"/>
<mx:Stroke id="axisStroke" alpha="0.0"></mx:Stroke>
<mx:Stroke id="a" weight="3" color="#92c5c6" alpha=".9"/>
<mx:Zoom id="zoomOut" duration="800"/>
<mx:SeriesSlide id="seriesSlide" duration="1000" direction="up"/>
<mx:VBox width="100%" height="100%" backgroundColor="white" fontSize="12"
horizontalAlign="center">
<mx:ColumnChart id="columnChart"
dataProvider="{this.demoArr}" width="100%" height="100%">
<mx:backgroundElements>
<mx:GridLines id="gridLines"
direction="both"
horizontalTickAligned="false"
verticalTickAligned="false">
<mx:verticalStroke>
<mx:Stroke color="0xa6cecd"
weight="30"
alpha="0.4"/>
</mx:verticalStroke>
<mx:horizontalStroke>
<mx:Stroke color="0xa6cecd"
weight="0.6"
alpha="1"/>
</mx:horizontalStroke>
</mx:GridLines>
</mx:backgroundElements>
<mx:verticalAxisRenderers>
<mx:AxisRenderer axis="{va1}"
tickLength="0"
showLine="false"
axisStroke="{a}"/>
</mx:verticalAxisRenderers>
<mx:horizontalAxis>
<mx:CategoryAxis categoryField="orgName" id="ca1">
</mx:CategoryAxis>
</mx:horizontalAxis>
<mx:horizontalAxisRenderers>
<mx:AxisRenderer axis="{ca1}"
tickLength="0"
showLine="true"
axisStroke="{a}"/>
</mx:horizontalAxisRenderers>
<mx:series>
<mx:ColumnSet type="clustered">
<mx:ColumnSeries id="co2"
itemRenderer="itemRender.MyCol"
maxColumnWidth="15"
yField="amt" xField="orgName"
showEffect="{wipeOut}"
hideEffect="{wipeIn}"
showDataEffect="{seriesInterpolate}">
<mx:verticalAxis>
<mx:LinearAxis baseAtZero="true"
id="va1"/>
</mx:verticalAxis>
<mx:fill>
<mx:LinearGradient id="linearGradient1">
<mx:entries>
<mx:Array>
<mx:GradientEntry color="0x004fcc"
ratio="0.0"
alpha="1.0"/>
<mx:GradientEntry color="0x0189ff"
ratio="1.0"
alpha="1.0"/>
</mx:Array>
</mx:entries>
</mx:LinearGradient>
</mx:fill>
</mx:ColumnSeries>
</mx:ColumnSet>
</mx:series>
<mx:seriesFilters>
<mx:Array/>
</mx:seriesFilters>
</mx:ColumnChart>
</mx:VBox>
</mx:Application>