Flex中如何用ActionScript代替MXML创建一个PieChart图表的例子

By Minidxer | November 16, 2008

接下来的例子演示了Flex中如何用ActionScript代替MXML创建一个PieChart图表。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white"
  6.         creationComplete="init();">
  7.  
  8.     <mx:Script>
  9.         <![CDATA[
  10.             import mx.charts.PieChart;
  11.             import mx.charts.series.PieSeries;
  12.             import mx.collections.ArrayCollection;
  13.  
  14.             private var medalsAC:ArrayCollection;
  15.             private var chart:PieChart;
  16.             private var series:PieSeries;
  17.  
  18.             /**
  19.              * Create and return a simple ArrayCollection to
  20.              * use as a data provider.
  21.              */
  22.             private function getDataProvider():ArrayCollection {
  23.                 var arr:Array = [];
  24.                 arr.push({label:"Product 1", data:3});
  25.                 arr.push({label:"Product 2", data:1});
  26.                 arr.push({label:"Product 3", data:4});
  27.                 arr.push({label:"Product 4", data:1});
  28.                 arr.push({label:"Product 5", data:5});
  29.                 arr.push({label:"Product 6", data:9});
  30.                 return new ArrayCollection(arr);
  31.             }
  32.  
  33.             private function init():void {
  34.                 medalsAC = getDataProvider();
  35.  
  36.                 /* Define pie series. */
  37.                 series = new PieSeries();
  38.                 series.nameField = "label";
  39.                 series.field = "data";
  40.                 /* Remove default dropshadow filter. */
  41.                 series.filters = [];
  42.  
  43.                 /* Define pie chart. */
  44.                 chart = new PieChart();
  45.                 chart.percentWidth = 100;
  46.                 chart.percentHeight = 100;
  47.                 chart.showDataTips = true;
  48.                 chart.dataProvider = medalsAC;
  49.                 chart.series = [series];
  50.  
  51.                 /* Add chart to the display list. */
  52.                 addChild(chart);
  53.             }
  54.         ]]>
  55.     </mx:Script>
  56.  
  57. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Chart | No Comments » | 483 views Tags: ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll