`
wwww2
  • 浏览: 14006 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

统计图组件化

阅读更多

<?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"
      xmlns:amcharts="http://www.amcharts.com/com_internal"
      backgroundColor="#FFFFFF"
      width="100%" height="100%" creationComplete="application1_creationCompleteHandler(event)"
      xmlns:Classes="Classes.*">
 <fx:Declarations>
  <s:HTTPService id="piehs" result="piehs_resultHandler(event)" url="{hsurl}"/>
 </fx:Declarations>
 
 <fx:Script>
  <![CDATA[
   import flash.filters.DropShadowFilter;
   
   import mx.collections.ArrayCollection;
   import mx.controls.Alert;
   import mx.core.FlexGlobals;
   import mx.events.FlexEvent;
   import mx.rpc.events.ResultEvent;
   
   [Bindable]
   private var shadow:DropShadowFilter = new DropShadowFilter(2,45,0,0.5);
   
   //html传参数据
   [Bindable]
   public var regionTitle:String;
   [Bindable]
   public var TitleBollean:Boolean=true;
   public var regionAlias:String;
   public var valueAlias:String;
   public var regionBoolean:Boolean;//是否映射
   public var regions:Array;
   [Bindable]
   public var balloonBollean:Boolean=true;
   [Bindable]
   public var hsurl:String;
   
   protected function application1_creationCompleteHandler(event:FlexEvent):void
   {
    var params:Object = FlexGlobals.topLevelApplication.parameters;//取出参数对象
    //hsurl
    if(params.hsurl!=null)
    {
     hsurl =params.hsurl;
    }else{
     Alert.show("无hsurl参数");
    }
    
    //balloonBollean
    var _balloonBollean:String;
    if(params.balloonBollean!=null)
    {
     _balloonBollean =params.balloonBollean;  
    }else{
     Alert.show("无balloonBollean参数");
    }
    
    if(_balloonBollean=="yes"){
     balloonBollean=true;
    }else if(_balloonBollean=="no"){
     balloonBollean=false;
    }
    
    //TitleBollean
    var _TitleBollean:String;
    if(params.TitleBollean!=null)
    {
     _TitleBollean =params.TitleBollean;  
    }else{
     Alert.show("无TitleBollean参数");
    }
    
    if(_TitleBollean=="yes"){
     TitleBollean=true;
    }else if(_TitleBollean=="no"){
     TitleBollean=false;
    }
    
    //regionTitle
    if(params.regionTitle!=null)
    {
     regionTitle =params.regionTitle;  
    }else{
     Alert.show("无regionTitle参数");
    }
    
    //regionAlias
    if(params.regionAlias!=null)
    {
     regionAlias =params.regionAlias;  
    }else{
     Alert.show("无regionAlias参数");
    }
    
    //valueAlias
    if(params.valueAlias!=null)
    {
     valueAlias =params.valueAlias;  
    }else{
     Alert.show("无valueAlias参数");
    }
    
    //regions
    var _regions:String;
    if(params.regions!=null)
    {
     _regions =params.regions;  
    }else{
     Alert.show("无regions参数");
    }
    regions=_regions.split(",");
    
    //regionBoolean
    var _regionBoolean:String;
    if(params.regionBoolean!=null)
    {
     _regionBoolean =params.regionBoolean;  
    }else{
     Alert.show("无regionBoolean参数");
    }
    
    if(_regionBoolean=="yes"){
     regionBoolean=true;
    }else if(_regionBoolean=="no"){
     regionBoolean=false;
    }
    
    piehs.send();
    
   }
   
   private var chartData:ArrayCollection;
   private var tempAC:ArrayCollection;
   [Bindable]
      private var labeltext:String;
   protected function piehs_resultHandler(event:ResultEvent):void
   {
    if(TitleBollean==true){
     titlelabel.visible=true;
     titlelabel.includeInLayout=true;
    }else{
     titlelabel.visible=false;
     titlelabel.includeInLayout=false;
    }
    
    chartData=event.result.data.item as ArrayCollection;
    var ac:ArrayCollection=new ArrayCollection();
    
    //映射判断
    //显示映射值及其他
       if(regionBoolean==true&&regions!=null){
     ac=new ArrayCollection();
     tempAC= new ArrayCollection();
     var tempACNEW:ArrayCollection=new ArrayCollection();
     var temptwoAC:ArrayCollection=new ArrayCollection();
     var temptwoACNEW:ArrayCollection=new ArrayCollection();
     
     //解出reigons
     for (var i:int = 0;i < chartData.length; i++)
     {
      var obj:Object = chartData[i] as Object;
      var flag = false;
      for(var j:int=0;j<regions.length;j++){
       if(regions[j]==obj[regionAlias]){
        tempAC.addItem(obj);//追加
        flag = true;
       }
      }
      if(flag){
       continue;
      }else{
      
      }
     }
     
     //解出其他
     var daobj:Object;
     for (var k:int =chartData.length-1;k>=0; k--)
     {
      var obj:Object = chartData[k] as Object;
      for(var l:int=0;l<regions.length;l++){
       if(regions[l]==obj[regionAlias]){
        daobj=new Object();
        chartData.removeItemAt(k);
        daobj=chartData;
       }
      }
     }
     temptwoAC.addItem(daobj);//追加

     //其他整合
//     for each(var elements:Object in temptwoAC[0]){
//      var o:Object = new Object();
//      o["value"] = elements[valueAlias];
//      o["name"] ="其它数据";
//      temptwoACNEW.addItem(o);
//     }
     
     //regions遍历
     for each(var elements:Object in tempAC){
      var o:Object = new Object();
      o["value"] = elements[valueAlias];
      o["name"] =elements[regionAlias];
      tempACNEW.addItem(o); 
     }
     ac.addAll(tempACNEW+temptwoACNEW);     
     
     pie.dataProvider=ac;
     
    //只显示映射值
    }else if(regionBoolean==false&&regions!=null){
      
      ac=new ArrayCollection();
      tempAC= new ArrayCollection();
      for (var i:int = 0;i < chartData.length; i++)
      {
       var obj:Object = chartData[i] as Object;
       for(var j:int=0;j<regions.length;j++){
       if(regions[j]==obj[regionAlias]){
        tempAC.addItem(obj);//追加
        }
       }
      }
      for each(var elements:Object in tempAC){
       var o:Object = new Object();
       o["value"] = elements[valueAlias];
       o["name"] =elements[regionAlias];
       ac.addItem(o); 
      }
   
     pie.dataProvider=ac;
    }
    
     if(balloonBollean==true){
      pieLegend.visible=true;
      pieLegend.includeInLayout=true;
      labeltext="[[percents]]%"
     }else{
      pieLegend.visible=false;
      pieLegend.includeInLayout=false;
      labeltext="[[title]]:<br>[[percents]]%"
     }
  }
   
  ]]>
 </fx:Script>
 <s:VGroup width="100%" height="100%" horizontalAlign="center" top="15">
  <s:Label text="{regionTitle}" id="titlelabel" visible="{TitleBollean}" includeInLayout="{TitleBollean}"
      fontFamily="宋体" fontSize="15" fontWeight="bold" color="#000000"/>
  
 <s:HGroup width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
 <Classes:AmPieChart
  id="pie"
  width="100%"
  height="100%"
  valueField="value"
  marginBottom="40"
  marginLeft="40"
  marginRight="40"
  marginTop="40"
  pieAlpha="0.8"
  titleField="name"
  depth3D="30"
  angle="20"
  fontSize="12"
  labelRadius="15"
  fontFamily="宋体"
  innerRadius="10"
  groupPercent="0"
  gradient="radial"
  filters="{[shadow]}"
  startDuration="1"
  startRadius="100"
  labelWidth="33"
  balloonText = "[[title]]: [[percents]]% ([[value]])"
  labelText="{labeltext}">
  <Classes:balloon>
   <amcharts:AmBalloon cornerRadius="3" borderThickness="2" borderColor="#FFFFFF" borderAlpha="1"/>        
  </Classes:balloon>
 </Classes:AmPieChart>
 <amcharts:AmLegend
  visible="{balloonBollean}" includeInLayout="{balloonBollean}"
  id="pieLegend" valueText=""
  marginBottom="10"
  marginLeft="10"
  marginTop="10"
  borderColor="#666666"
  borderAlpha="1" align="left"
  markerType="bubble"
  width="165" height="100%"
  textClickEnabled="false"
  dataProvider="{pie}"
  switchable="false"/>
  <mx:Spacer width="15"/>
 </s:HGroup>
 </s:VGroup>
</s:Application>

0
5
分享到:
评论

相关推荐

    直线统计图和弧线统计图

    总之,直线统计图和弧线统计图是数据可视化中的基本元素,它们在各种应用中都有广泛的应用。Android Studio提供了一系列工具和库,使得在移动平台上创建这些图表变得简单易行。通过深入研究和实践提供的代码,开发者...

    Android:自定义组件绘制柱状统计图

    在Android开发中,自定义组件是一项重要的...通过以上步骤,你就能构建一个功能齐全且具有交互性的柱状统计图组件。在实际项目中,可以根据需求进行扩展,如添加颜色渐变、阴影效果、图例等,以增强图表的视觉表现力。

    jsp动态统计图组件(包括饼图,柱图,折线图等)

    总之,这个JSP动态统计图组件为Web开发者提供了一套全面的解决方案,让生成和管理动态图表变得简单高效。无论你是新手还是经验丰富的开发者,都可以利用这个工具提升你的项目质量,为用户提供更加生动、直观的数据...

    html5+css3的条形统计图和折线统计图源码

    "html5+css3的条形统计图和折线统计图源码"是一个利用现代Web技术实现的数据可视化项目,它结合了HTML5、CSS3、jQuery和Ajax等多种关键技术,为开发者提供了一个灵活且互动的图表展示方案。 首先,HTML5是现代网页...

    c#调用OWC组件绘统计图代码

    本篇文章将深入探讨如何使用C#调用Office Web Components(OWC)组件来绘制2D和3D统计图。OWC是Microsoft提供的一组控件,允许开发者在Web页面或桌面应用中嵌入Excel、Word和PowerPoint的功能,其中包括图表绘制。 ...

    Bootstrap统计图后台管理模板

    "Bootstrap统计图后台管理模板"是基于Bootstrap框架构建的,专为后台管理系统设计,特别关注数据可视化和销售统计。这种模板能够帮助开发者快速搭建具有现代感、用户友好的管理界面,用于展示各类统计数据,例如销售...

    扫描图片统计图形个数

    3. 统计图形数量:在遍历过程中,每当遇到一个新的连通组件(即一个新图形的起点),就增加计数器。对于每个新的像素,检查它是否与已标记的像素四连通,如果不是,则认为是新的图形。 4. 输出结果:最后,计数器的...

    自写的一个简易统计图统计图控件

    这个自写的统计图控件提供了简单便捷的数据可视化解决方案,对于那些希望快速集成图表功能但又不希望引入大型图表库的项目来说,是一个很好的选择。然而,为了不断提高,开发者鼓励用户提出建议和意见,以进一步完善...

    unity 统计图插件

    在Unity中,统计图插件是提升用户体验和数据可视化的关键组件。"unity 统计图插件"正是这样一款工具,它允许开发者轻松地在Unity项目中集成各种类型的图表,如饼状图、线形图、条形图和钟表图等。 饼状图是一种用于...

    扇形统计图代码.zip

    这个压缩文件可能是一个开发者分享的项目,用于演示或教学如何在编程中创建扇形统计图,尤其适用于数据可视化应用。扇形统计图是一种常用的图形,能够直观地展示各部分占总体的比例关系。 【描述】中提到,该资源...

    Android:自定义组件绘制饼状统计图

    本示例——"Android:自定义组件绘制饼状统计图",旨在教你如何构建一个能够显示数据比例的饼状图。下面将详细阐述自定义组件的基本步骤以及饼状图的绘制原理。 首先,我们需要理解自定义组件的基础。在Android中,...

    可以左右拖动和快速滑动的折线统计图

    本项目着重介绍了一个基于SurfaceView开发的可左右拖动并支持快速滑动的折线统计图组件。 首先,我们需要理解`SurfaceView`。它是Android系统中一种特殊的视图,它允许开发者创建高性能的图形界面,特别适合处理...

    ios-圆形统计图.zip

    综上所述,"ios-圆形统计图.zip"包含的是一个自定义的、易于使用的圆形统计图组件,它结合了Core Graphics、Core Animation和触摸事件处理等iOS图形编程的关键技术,为开发者提供了一种高效展示数据的方式。...

    JFreeChart+JSP实现统计图展示

    总的来说,"JFreeChart+JSP实现统计图展示"是一个典型的Web应用开发流程,它涉及到前后端的交互、数据库操作和数据可视化,展示了Java技术栈在数据处理和展示方面的强大能力。这个项目对于学习和理解Web应用开发、...

    JavaScript引用Silverlight统计图

    `supermap iDesktop`标签表明这个统计图可能涉及到地理信息的可视化,如地图上的点、线、面元素的统计分布。 综上所述,这个案例涵盖了JavaScript和Silverlight的交互、数据统计图的实现、以及可能的GIS应用。...

    Flash+.NET 统计图

    "Flash+.NET 统计图"的主题聚焦于如何利用Flash技术和.NET框架来创建动态且交互式的图表,为Web应用程序提供数据展示功能。这种方法的优点在于,Flash提供了丰富的图形表现力,而.NET则提供了强大的后端处理能力。 ...

    mui 靠谱的appui,带统计图

    "mui 靠谱的appui,带统计图"这个标题暗示了MUI在构建可靠且具备数据可视化的APP用户界面方面的优势。本文将深入探讨MUI的核心特性,以及如何利用其集成的统计图功能来提升APP的用户体验。 一、MUI概述 MUI的设计...

    uniapp_统计图_uCharts.zip

    7. **组件化开发**:如果项目包含自定义组件,可以学习如何将图表封装成可复用的组件,提高代码复用性。 8. **版本控制**:理解`.gitignore`文件的作用,以及如何在Git环境下管理代码版本。 通过深入研究这个...

    H5柱形统计图

    【H5柱形统计图】是一种基于HTML5技术创建的可视化图表,主要用于数据展示和分析。HTML5作为现代网页开发的基石,提供了丰富的API和元素,使得开发者无需依赖额外的插件或框架就能构建出交互性强、兼容性好的柱状图...

Global site tag (gtag.js) - Google Analytics