Flex 动态创建多个曲线图/柱形图 ColumnSeries

获取数据后的回调函数

private function resultHandlerDay(event:ResultEvent):void {

statisticCount = event.result.statistic.weekstatistic.length;

var source:ArrayCollection = event.result.statistic.buildingtatistic;

var seriesArr:Array = new Array();

for(var i:Number = 0;i<source.length;i++){

var columnSeries:ColumnSeries = new ColumnSeries();

columnSeries.xField = "statday";

columnSeries.yField = "pitchpower"+(i+1);

columnSeries.displayName = source[i].buildingname;

seriesArr.push(columnSeries);

}

if(statisticCount==null){

myData=null;

}else{

columnCharts.series = seriesArr;

columnCharts.dataProvider = event.result.statistic.weekstatistic;

}

<mx:HTTPService id="myService" url="loaddata.action" method="GET" result="resultHandlerDay(event)">

</mx:HTTPService>

<mx:Panel

title="能耗统计"

width="643" height="462" fontSize="12" paddingTop="10" paddingBottom="0" paddingLeft="0" paddingRight="0" layout="absolute"

borderAlpha="1"

id="panelid"

borderThicknessBottom="0"

borderThicknessLeft="0"

borderThicknessRight="0"

borderThicknessTop="0"

horizontalGap="0"

verticalGap="0"

verticalAlign="top"

titleStyleName="fileItemover" x="0" y="0">

<mx:ViewStack id="myViewstack" width="643" height="422" borderStyle="solid" paddingTop="0" backgroundColor="white" x="0" y="10">

<mx:VBox id="child1" height="411" width="632" verticalAlign="middle">

<mx:ColumnChart id="columnCharts" dataProvider="{myData}" showDataTips="true" columnWidthRatio="0.6" width="623" height="338">

<mx:backgroundElements>

<mx:GridLines>

<mx:horizontalStroke>

<mx:Stroke color="haloSilver" weight="0" />

</mx:horizontalStroke>

</mx:GridLines>

</mx:backgroundElements>

<mx:verticalAxis>

<mx:LinearAxis id="la" baseAtZero="true" title="能耗(单位:万千瓦时)"/>

</mx:verticalAxis>

<mx:verticalAxisRenderers>

<mx:AxisRenderer axis="{la}" canDropLabels="false" fontSize="12"/>

</mx:verticalAxisRenderers>

<mx:horizontalAxis>

<mx:CategoryAxis id="ca" categoryField="statday" title="时间(单位：周)"/>

</mx:horizontalAxis>

<mx:horizontalAxisRenderers>

<mx:AxisRenderer axis="{ca}" canDropLabels="false" fontSize="12"/>

</mx:horizontalAxisRenderers>

<mx:series>

<mx:ColumnSeries xField="statday" yField="pitchpower1" displayName="建筑" fontSize="12" labelPosition="outside" id="changeOption1" showDataEffect="{interpolateIn}">

<mx:fill>

<mx:RadialGradient>

<mx:entries>

<mx:Array>

<mx:GradientEntry color="haloBlue"

ratio="0.0"

alpha="1.0" />

</mx:Array>

</mx:entries>

</mx:RadialGradient>

</mx:fill>

</mx:ColumnSeries>

</mx:series>

</mx:ColumnChart>

<mx:Legend horizontalGap="28" paddingLeft="150" id="legend" dataProvider="{columnCharts}" direction="horizontal" legendItemClass="BigFontLegendItem" width="621" height="32"/>

</mx:VBox>

</mx:ViewStack>

</mx:Panel>

xml 数据源：

</weekstatistic>

</weekstatistic>

</buildingtatistic>

</buildingtatistic>

</statistic>

tags:Flex 动态创建多个曲线图/柱形图 ColumnSeries

本文转自yjflinchong 51CTO博客，原文链接：http://blog.51cto.com/yjflinchong/1165112，如需转载请自行联系原作者