flex编程动态生成图像

 更新时间:2008年12月19日 13:23:15   作者:  
程序需求:动态生成柱形图,柱形条数不确定,柱形字段不确定
要动态生成图像必需先把记录转为图像处理所需的格式,以下是处理类
复制代码 代码如下:

package emtit.utils
{
import mx.charts.CategoryAxis;
import mx.charts.series.ColumnSeries;
import mx.charts.series.PieSeries;
import mx.collections.ArrayCollection;
/**
* author:黄建文
* data:2008-12-03
* 图形数据转换类
*/
public class ChartDataTransform
{
public function ChartDataTransform()
{
}
/**
*高级图表分析生成,把datagride的数据转换为适合图像显示的数据
* 返回数据格式如下
* [{keyword1:'张三',keyword1:'10',keyword3:11},{keyword1:'李四',keyword1:'10',keyword3:11}]
*
*/
public static function advanced(sourceData:Array,xaxis:String,yfield:Array):ArrayCollection{
var i:int,j:int;
var obj:Object;
var name:String,field:String;
var returnObj:Object = new Object();
var returnArrC:ArrayCollection=new ArrayCollection;
var nowname:*=null;
var isChange:Boolean=false;
sourceData.sortOn(xaxis);
for(i=0;i<sourceData.length;i++){
for(field in sourceData[i]){
name=sourceData[i][xaxis];
if(name!=nowname){
returnObj[name]=new Object;
returnObj[name][xaxis]=sourceData[i][xaxis];
nowname=name;
}
for(j=0;j<yfield.length;j++){
if(field==yfield[j]['data']){
if(returnObj[name][field]==undefined){
returnObj[name][field]=0;
}
returnObj[name][field]=parseInt(returnObj[name][field])+parseInt(sourceData[i][field]);
// trace('把这个字段'+yfield[j]['data']+'的值'+sourceData[i][field]+'放到Y轴的一个数组中');
}
}
}
}
for each(var num:* in returnObj){
returnArrC.addItem(num);
for(var field2:String in num){
trace(num[xaxis]+'要输出图的字段:'+field2);
}
}
return returnArrC;
}
/**
*设置柱图形categoryField
*/
public static function setCategoryAxis(categoryField:String):CategoryAxis{
var ca:CategoryAxis=new CategoryAxis;
ca.categoryField=categoryField;
return ca;
}
/**
* 设置柱形X轴对应柱状数据
* xy数组必需为xy=array({lable:'分数',data:'keyword2'},{lable:'只数',data:'keyword3'})
* displayName要与setCategoryAxis的值对应
*/
public static function setColumnSeries(yFieldArr:Array,xField:String):Array{
var cs:ColumnSeries;
var rsArr:Array=new Array;
for(var i:int=0;i<yFieldArr.length;i++){
cs=new ColumnSeries;
cs.displayName=yFieldArr[i]['lable'];
cs.xField=xField;
cs.yField=yFieldArr[i]['data'];
rsArr.push(cs);
trace('第'+i+'条柱的属性,displayName:'+cs.displayName+',xField:'+cs.xField+',yField:'+cs.yField);
}
return rsArr;
}
}
}

在视图中代码如下
复制代码 代码如下:

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()" layout="absolute" width="468" height="514" showCloseButton="true" close="PopUpManager.removePopUp(this)">
<mx:Script>
<![CDATA[
import mx.automation.delegates.charts.ColumnSeriesAutomationImpl;
import mx.controls.Label;
import mx.charts.series.ColumnSeries;
import mx.charts.chartClasses.Series;
import mx.collections.ArrayCollection;
import yes3d.model.MainModel;
import mx.managers.PopUpManager;

private function init():void{
//下面这三句是数据转换
ch_column.dataProvider=MainModel.chartData;
ch_column.horizontalAxis=ChartDataTransform.setCategoryAxis('xaxis');
ch_column.series=ChartDataTransform.setColumnSeries([{lable:orderby,data:'value'}],'xaxis');
for(var i:int=0;i<ch_column.series.length;i++){
trace('id:'+ch_column.series[i]['id']+',displayName:'+ch_column.series[i]['displayName']+',yfield:'+ch_column.series[i]['yField']+',xfield:'+ch_column.series[i]['xField']);
}
}
]]>
</mx:Script>
<mx:ViewStack x="0" y="0" id="vs_chart" width="100%" height="100%">
<mx:Canvas id="cv_column" label="柱型图" width="100%" height="100%">
<mx:ColumnChart id="ch_column" showDataTips="true" x="24" y="61" width="399" height="336">
</mx:ColumnChart>
<mx:Legend dataProvider="{ch_column}"/>
</mx:Canvas>
<mx:Canvas id="cv_pie" label="饼型图" width="100%" height="100%">
<mx:PieChart id="ch_pie" showDataTips="true" dataProvider="{MainModel.chartData}" x="38" y="48" height="394" width="389">
<mx:series>
<mx:PieSeries nameField="xaxis" field="value"/>
</mx:series>
</mx:PieChart>
<mx:Legend dataProvider="{ch_pie}"/>
</mx:Canvas>
</mx:ViewStack>
</mx:TitleWindow>

相关文章

  • 基于Socket的网络连接 Flex与.NET互操作(一)

    基于Socket的网络连接 Flex与.NET互操作(一)

    Flash/Flex也支持基于Socket的网络连接 ,服务器端可以是C++,VB,C#,Java等任一语言开发。监听一个网络端口便可以接收到Flash/Flex开发的客户端的连接。
    2009-06-06
  • Flex 自动获取焦点 监听全局键盘事件

    Flex 自动获取焦点 监听全局键盘事件

    Flex 编程注意之自动获取焦点、监听全局键盘事件
    2009-07-07
  • Flex ShareObject简单应用

    Flex ShareObject简单应用

    Share object一般用来保存前来访问的用户的个人信息到用户的机器上。比如用户登陆过后保存他的名字,下次访问时自动显示,或者保存用户的个性化设置等等。
    2009-06-06
  • FLEX 日期时间操作

    FLEX 日期时间操作

    找了很久,还是没有找到包含时间以下的东西,算了,还是麻烦一点,用日期加时间来处理吧.这里需要注意的是,它的时间日期跟其他语言是差不多的.所以要注意进行处理.
    2009-07-07
  • Flex 动态绑定BindingUtils.bindProperty

    Flex 动态绑定BindingUtils.bindProperty

    Flex 动态绑定BindingUtils.bindProperty实现代码。
    2009-06-06
  • Flex程序开发心得小结

    Flex程序开发心得小结

    和Flash的开发环境相比,Flex提供的组件库确实很诱人,但由于功能太全面,导致程序的体积大,有时候使用不当,可能会影响程序运行效率。
    2008-04-04
  • Flex 创建复数行文本内容的List

    Flex 创建复数行文本内容的List

    效果不错的flex多行文本
    2008-11-11
  • Flex 文本框的输入下拉提示

    Flex 文本框的输入下拉提示

    在很多时候我们要实现一个输入,显示提示并且可以从提示选择的功能,这是一种基于ComboBox 的变相实现,从服务器上动态获取
    2009-07-07
  • Flex include和import ActionScript代码

    Flex include和import ActionScript代码

    为了让你的MXML代码可读性增强,你可以在<mx:Script>标签内引用ActionScript代码文件,而不是把大块的代码都插入到<mx:Script>里。引用ActionScript有include和import两种方式。
    2009-08-08
  • Flex Data Binding详解

    Flex Data Binding详解

    Data BindIng简单的说就是当绑定源属性发生变化时,Flex 会把绑定源变化后属性的值赋给目的物的属性。做到了数据同步。
    2009-09-09

最新评论