主要是为了解决当数据源不确定到底有几类数据的问题,只要动态添加线就可以了,LineChart这个组件可以先写出来,不多说直接上代码:
<?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">
<fx:Declarations>
</fx:Declarations>
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.charts.series.LineSeries;
import mx.collections.ArrayCollection;
import mx.utils.ObjectUtil;
[Bindable]
public var arrayC:ArrayCollection=new ArrayCollection(); //数据源
private var array:Array=[]; //存储 myChart.series数据源
/** 移除数据
* @author liuweiwei 2012-10-23
* @return name
*/
private function removeFromArray(name:String):void
{
for (var a:String in arrayC)
{
trace("删除属性:" + arrayC[a][name]);
delete arrayC[a][name];
}
array=[];
for (var b:String in myChart.series)
{
if (myChart.series[b].yField != name)
{
array.push(myChart.series[b]);
}
}
myChart.series=array;
//myChart.dataProvider = arrayC;
legend_id.dataProvider=myChart;
}
/** 添加数据除数据
*/
private function addToAC():void
{
/*判断 数据源是否为空,为空直接放入第一个AC对象 ,否则 将自己的第二个属性值加入到数据源中*/
if (arrayC.length > 0)
{
var newAc:ArrayCollection=createArray();
for (var a:String in arrayC)
{
for (var c:String in newAc)
{
if (arrayC[a].Date == newAc[c].Date)
{
var name:String=getObjectProperties(newAc[c], 1);
arrayC[a][name]=newAc[c][name];
trace("增加属性:" + newAc[c][name]);
break;
}
}
}
}
else
{
arrayC=createArray();
}
/*根据数据源动态生成线*/
/*1.取出每个要增加对象的属性 name */
/* 拿到AC的第一个对象,就可以拿到他的所有属性名*/
var obejct:Object=arrayC.getItemAt(0);
var objInfo:Object=ObjectUtil.getClassInfo(obejct);
var fieldNames:Array=objInfo["properties"] as Array;
var newFileNames:Array=[];
for each (var q:String in fieldNames)
{
if (q != "Date")
{
newFileNames.push(q);
}
}
/*2.根据name 取出相应 对象值*/
array=[];
for (var b:String in newFileNames)
{
var lineSeries:LineSeries=new LineSeries(); //设置图表的系列
lineSeries.xField="Date"
lineSeries.yField=newFileNames[b];
lineSeries.displayName=newFileNames[b];
lineSeries.setStyle("form", "curve");
//lineSeries.setStyle("lineStroke",s1);
//替换或者新增
array.push(lineSeries);
}
myChart.series=array; //给图表系列赋值
}
/** 返回对象的某个属性名称
* @author liuweiwei 2012-10-23
* @param obejct
* @param index
* @return name
*/
public function getObjectProperties(obejct:Object, index:int):String
{
var objInfo:Object=ObjectUtil.getClassInfo(obejct);
//获取到对象的类名
//获取到对象的属性列表
var fieldName:Array=objInfo["properties"] as Array;
return fieldName[index];
}
private function getPt():void
{
var _menu:Object={Date: "2011-12-1", "能源": 17};
var a:String=getObjectProperties(_menu, 0);
var b:String=getObjectProperties(_menu, 1);
trace(a);
trace(b);
}
private function createArray():ArrayCollection
{
var ac:ArrayCollection=new ArrayCollection();
var name:String="设备" + Math.floor(Math.random() * 10);
for (var i:int=0; i < 12; i++)
{
var o:Object=new Object();
o.Date=i + "时";
o[name]=Math.floor(Math.random() * 10);
ac.addItem(o);
}
return ac;
}
protected function button3_clickHandler(event:MouseEvent):void
{
removeFromArray(remove_id.text);
}
]]>
</fx:Script>
<mx:Legend dataProvider="{myChart}"
height="20"
id="legend_id"/>
<mx:LineChart id="myChart"
dataProvider="{arrayC}"
width="400"
height="360"
showDataTips="true">
<mx:verticalAxis>
<mx:LinearAxis id="laxis"
autoAdjust="true"
baseAtZero="false"/>
</mx:verticalAxis>
<mx:horizontalAxis>
<mx:CategoryAxis id="ca"
dataProvider="{arrayC}"
categoryField="Date"/>
</mx:horizontalAxis>
<mx:horizontalAxisRenderers>
<mx:AxisRenderer axis="{ca}"
canDropLabels="true"/>
</mx:horizontalAxisRenderers>
<mx:series>
</mx:series>
</mx:LineChart>
<s:Button label="获取对象属性"
click="getPt()"/>
<s:Button label="createArray"
click="createArray()"/>
<s:Button label="新增"
click="addToAC()"/>
<s:TextInput text="设备"
id="remove_id"/>
<s:Button label="移出"
click="button3_clickHandler(event)"/>
</s:Application>