Flex use AmChart to generate 3D pie chart

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Use the pie charts show the relevant data in the project, because the Flex comes with the PieChart appearance is difficult to meet the aesthetic needs, write your own skin is too much trouble, I searched the Internet to find a amChart frame pack, with the inside of the AmPieChart could have the effect of 3D pie chart, and Legend. Legend default is horizontally arranged, see the API couldn't find how to get into the vertical, so I adopted the way of saving the curve, the width is set to become the legend can only hold a line width, the legend is true according to the effect of the vertical arrangement. Below are the results map


The following code:


<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx=" ; 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:amcharts=" ;>
	
	<fx:Script>
		<![CDATA[
			import com.amcharts.events.PieChartEvent;
			[Bindable]
			private var arr:Array = [{id:1,city:'Beijing',money:1000,pay:300,color:0xbce02e},{id:2,city:'Shanghai',money:1200,pay:500,color:0xe0642e},{id:3,city:'Tianjin',money:800,pay:200,color:0xe0d62e},{id:4,city:'Chongqing',money:800,pay:200,color:0x2e97e0},{id:5,city:'Qingdao',money:500,pay:200,color:0xb02ee0}];
					
		]]>
	</fx:Script>  
	<fx:Declarations>
		<!-- non visual elements (e.g., service, value object) here -->
	</fx:Declarations>

	<s:VGroup>
		
<amcharts:AmLegend   width="150" dataProvider="{pie2}"   markerType="square" align="right" switchType="x" valueAlign="left"
					 verticalGap="0" reversedOrder="true"  fontFamily="Microsoft Accor" fontWeight="bold" />
<amcharts:AmPieChart  dataProvider="{arr}" titleField="city" valueField="money"  id="pie2"   labelTickAlpha="0" labelRadius="15"  
                                       depth3D="30" angle="30"  outlineColor="0xffffff" outlineAlpha="0.3" outlineThickness="1"  
                                        labelText="[[title]]:[[percents]]" colorField="color">
</amcharts:AmPieChart>

	</s:VGroup>

	
</s:Application>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Frank at January 06, 2014 - 1:45 AM