Flex中如何通过fills样式改变PieChart图表填充颜色的例子

By Minidxer | November 22, 2008

接下来的例子演示了Flex中如何通过fills样式,改变PieChart图表填充颜色。

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


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

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="horizontal"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:XML id="dp">
  8.         <products>
  9.             <product label="Product 1" data="3" />
  10.             <product label="Product 2" data="1" />
  11.             <product label="Product 3" data="4" />
  12.             <product label="Product 4" data="1" />
  13.             <product label="Product 5" data="5" />
  14.             <product label="Product 6" data="9" />
  15.             <product label="Product 7" data="2" />
  16.         </products>
  17.     </mx:XML>
  18.  
  19.     <mx:PieChart id="pieChart"
  20.             dataProvider="{dp.product}"
  21.             showDataTips="true"
  22.             height="100%"
  23.             width="100%">
  24.         <mx:series>
  25.             <mx:PieSeries id="pieSeries"
  26.                     field="@data"
  27.                     labelPosition="callout">
  28.                 <mx:fills>
  29.                        <mx:SolidColor color="red" alpha="1.0" />
  30.                        <mx:SolidColor color="haloOrange" alpha="1.0" />
  31.                        <mx:SolidColor color="yellow" alpha="1.0" />
  32.                        <mx:SolidColor color="haloGreen" alpha="1.0" />
  33.                        <mx:SolidColor color="haloBlue" alpha="1.0" />
  34.                 </mx:fills>
  35.                 <mx:filters>
  36.                     <mx:Array />
  37.                 </mx:filters>
  38.             </mx:PieSeries>
  39.         </mx:series>
  40.     </mx:PieChart>
  41.  
  42. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

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

Search Posts