在Flex中的LineChart線條上顯示Label標識

在Flex的Chart中,柱狀圖很容易就加上Label了,只要設置ColumnSeries的 labelField=""和 labelPosition="outside"兩個屬性就可以。

但是在LineChart中卻沒有類似屬性,至於你找沒找到我不知道,反正我是沒找到難過

但是一番研究過後,發現只要LineSeries的itemRenderer中稍做修改就可以了。


代碼如下:


package com.hp.rms.view
{
	import flash.display.Graphics;
	import flash.geom.Rectangle;
	
	import mx.charts.chartClasses.LegendData;
	import mx.charts.renderers.CircleItemRenderer;
	import mx.charts.series.LineSeries;
	import mx.charts.series.items.LineSeriesItem;
	import mx.controls.Label;
	import mx.core.IDataRenderer;
	import mx.core.UIComponent;
	import mx.graphics.IFill;
	import mx.graphics.SolidColorStroke;
	import mx.graphics.Stroke;
	import mx.states.SetStyle;

	public class LineRenderer extends UIComponent implements IDataRenderer
	{
		private var _label:Label;
		private var _yField:String;
		private var _color:Number;

		private var _chartItem:LineSeriesItem;

		public function LineRenderer():void
		{
			super();
			_label=new Label();
			addChild(_label);
		}

		public function get data():Object
		{
			return _chartItem;
		}

		public function set data(value:Object):void
		{
			if (_chartItem == value)
				return;
			if (value is LineSeriesItem)
			{
				_chartItem=LineSeriesItem(value);
				_label.text=_chartItem.yValue.toString();
				_color=SolidColorStroke(LineSeries(_chartItem.element).getStyle("lineStroke")).color;
				_label.setStyle("color", _color);
				_label.setStyle("fontSize",16);
			}
			else if (value is LegendData)
			{
				_color=SolidColorStroke(LineSeries(LegendData(value).element).getStyle("lineStroke")).color;
			}
		}

		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
		{
			super.updateDisplayList(unscaledWidth, unscaledHeight);
			var rc:Rectangle=new Rectangle(0, 0, width, height);

			var g:Graphics=graphics;
			g.clear();
			g.moveTo(rc.left, rc.top);
			g.beginFill(_color);
			g.drawCircle(5, 5, 5);
			g.beginFill(0xffffff);
			g.drawCircle(5, 5, 3);
			g.endFill();

			_label.setActualSize(_label.getExplicitOrMeasuredWidth(), _label.getExplicitOrMeasuredHeight());
			_label.move(unscaledWidth, unscaledHeight);
		}
	}
}

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章