关于自定义Flex chart的legend信息

1 篇文章 0 订阅
1 篇文章 0 订阅

不说废话,直接上代码~

<?xml version="1.0" encoding="utf-8"?>
<mx:Application name="PieSeries_labelFunction_test"
				xmlns:mx="http://www.adobe.com/2006/mxml"
				layout="vertical"
				verticalAlign="middle"
				backgroundColor="white"
				creationComplete="init()">
	
	<mx:Script>
		<![CDATA[
			import mx.charts.HitData;
			import mx.charts.LegendItem;
			import mx.charts.chartClasses.LegendData;
			import mx.charts.series.items.PieSeriesItem;
			import mx.collections.ArrayCollection;
			import mx.graphics.SolidColor;
			import mx.utils.StringUtil;
			
			import spark.components.BorderContainer;
			import spark.components.Button;
			import spark.components.HGroup;
			
			[Bindable]
			public var dataLegend:ArrayCollection;
			private function pieSeries_labelFunc(item:Object, field:String, index:Number, percentValue:Number):String {
				return StringUtil.substitute("{0} ({1}%)",
					item.@label,
					percentValue.toFixed(1));
			}
			
			private function init():void{
				var obj:Object = new Object();

				var item:ArrayCollection = new ArrayCollection();
				for(var i:int = 0; i < pieSeries.items.length; i++){
					var pirSItem:PieSeriesItem = pieSeries.items[i] as PieSeriesItem;
					
					var id:LegendData = new LegendData();
					id.label = "Product data:" + i;
					id.aspectRatio = 1;
					var maker:BorderContainer = new BorderContainer();
					maker.height = 5;
					maker.width = 5;
					maker.setStyle("backgroundColor",(pirSItem.fill as SolidColor).color);
					id.marker= maker;
					item.addItem(id);
				}
				
				dataLegend = item
				trace(pieSeries.items);
			}
			
			private function chartTip(e:HitData):String{  
				
					return "";
			} 
		]]>
	</mx:Script>
	
	<mx:XMLListCollection id="dp">
		<mx:source>
			<mx:XMLList>
				<product label="Product 1" data="3" />
				<product label="Product 2" data="1" />
				<product label="Product 3" data="4" />
				<product label="Product 4" data="1" />
				<product label="Product 5" data="5" />
				<product label="Product 6" data="9" />
			</mx:XMLList>
		</mx:source>
	</mx:XMLListCollection>
	
	<mx:Panel styleName="opaquePanel"
			  width="400"
			  height="300">
		<mx:PieChart id="pieChart"
					 dataProvider="{dp}"
					 showDataTips="false"
					 height="100%"
					 width="100%"
					 >
			<mx:series>
				<mx:PieSeries id="pieSeries"
							  field="@data"
							  nameField="@label"
							  labelPosition="callout"
							  labelFunction="pieSeries_labelFunc" />
			</mx:series>
		</mx:PieChart>
		<mx:ControlBar width="100%" >
			<mx:Legend dataProvider="{dataLegend}"
					   direction="horizontal"
					   horizontalGap="100"
					   width="100%" 
					   >
			</mx:Legend>
		</mx:ControlBar>
	</mx:Panel>
	
</mx:Application>



效果图

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值