Flex 雷达图 RadarChart 运用

　　今天网上找了很多雷达图的资料，结果都用不了，不是代码不全，就是版本不支持，下面介绍我最后找到的资料。

 

   http://flex.amcharts.com/ 这个网站的雷达图效果很炫，虽然是免费的，但会添加这个网站的链接，搜了下破解居然能找到破解这个链接的，具体操作如下。

 

1、   http://flex.amcharts.com/ 网站中下载免费的图形资源，我下的是：amcharts_flex_components_1.8.3.1.zip。

2、解压后在Documentation\Build文件夹中找到amChartsFB4.swc  （我的Flex用的是4.1版本）

3、将amChartsFB4.swc  复制到项目的libs文件夹中

4、Flex src下创建文件夹Class  用来存放ActionScript类文件

5、在Class文件夹下创建ActionScript类 AmRadarChart

 

package Class
{
     import com.amcharts.AmRadarChart;
    
     public  class AmRadarChart  extends com.amcharts.AmRadarChart
    {
         public  function AmRadarChart()
        {
             super();
        }
         public  function onClick():void{
            this;
        }
        override protected  function createChildren():void{
             super.createChildren();  
             if (_amchartsLink){  
                 _amchartsLink.visible= false; 
            }

        }
    }
}

6、定义前台显示MXML应用程序，代码如下

 

View Code

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" 
               xmlns:Class="Class.*" xmlns:amcharts="http://www.amcharts.com/com_internal" >
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Declarations>
        <!-- 将非可视元素（例如服务、值对象）放在此处 -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
             import mx.collections.ArrayCollection;
            
            [Bindable]
             private  var chartData:ArrayCollection = new ArrayCollection([
                {Name:"Sales", InSum:20, TransactionNumber:18, SalesAmount:20, UnitAreaAttraction:7,SalesPerUnitArea:39,  ConversionRate:45},
                {Name:"Development", InSum:15, TransactionNumber:13, SalesAmount:20, UnitAreaAttraction:18,SalesPerUnitArea:22,  ConversionRate:4},
                {Name:"Marketing", InSum:12, TransactionNumber:16, SalesAmount:20, UnitAreaAttraction:8,SalesPerUnitArea:38,  ConversionRate:15}, 
                {Name:"Customer support", InSum:18, TransactionNumber:15, SalesAmount:10, UnitAreaAttraction:18,SalesPerUnitArea:32,  ConversionRate:35}, 
                {Name:"Administration", InSum:11, TransactionNumber:5, SalesAmount:20, UnitAreaAttraction:17,SalesPerUnitArea:12,  ConversionRate:25}, 
                {Name:"Information technology", InSum:19, TransactionNumber:13, SalesAmount:20, UnitAreaAttraction:18,SalesPerUnitArea:2,  ConversionRate:8}]); 

        ]]>
    </fx:Script>

    <Class:AmRadarChart id="chart" dataProvider="{chartData}" categoryField="Name" width="100%" height="235" startDuration="1">  
        <Class:valueAxes>
            <amcharts:ValueAxis fillAlpha="0.05" fillColor="0x000000" axisAlpha="0.3" gridAlpha="0.05" fontWeight="bold" min="0"/> 
        </Class:valueAxes>
        <Class:graphs>  
            
            <amcharts:AmGraph   
                
                title="客流量"  
                
                valueField="InSum"  
                
                bullet="bubble"  
                
                balloonText="客流量: [[value]]"/>                  
            
            <amcharts:AmGraph   
                
                title="交易笔数"  
                
                valueField="TransactionNumber"  
                
                bullet="round" 
                
                markerType="square"  
                
                balloonText="交易笔数: [[value]]"/>     
            
            <amcharts:AmGraph   
                
                title="销售额"  
                
                valueField="SalesAmount"  
                
                bullet="square"  
                
                balloonText="销售额: [[value]]"/>                  
            
            <amcharts:AmGraph   
                
                title="集客力"  
                
                valueField="UnitAreaAttraction"  
                
                bullet="custom" 
                
                markerType="square"  
                
                balloonText="集客力: [[value]]"/>    
            
            <amcharts:AmGraph   
                
                title="坪效"  
                
                valueField="SalesPerUnitArea"  
                
                bullet="triangleDown"  
                
                balloonText="坪效: [[value]]"/>                  
            
            <amcharts:AmGraph   
                
                title="提袋率"  
                
                valueField="ConversionRate"  
                
                bullet="triangleUp" 
                
                markerType="square"  
                
                balloonText="提袋率: [[value]]"/>    
            
        </Class:graphs>      
        
        
        
    </Class:AmRadarChart>  

    <amcharts:AmLegend fontSize="12" markerType="triangleDown" dataProvider=" {chart}" align="left" textClickEnabled="false" width="100%" borderAlpha="1.0"/> 

</s:Application>

 

相关链接：http://www.cnblogs.com/wyqx/archive/2011/07/29/2120690.html