Flex LineChart动态创建曲线
发布时间:2020-12-15 04:10:52 所属栏目:百科 来源:网络整理
导读:假如后台传到前台的数据格式是: [ {time:4,[{name:"技术响应时长",value:50%}],{name:"排除故障时长",value:50%}]},{time:5,value:40%},value:60%}]},{time:6,value:70%},value:30%}]}] ? 那么前台创建曲线是 protected function getMEMPerfDataResult(even
假如后台传到前台的数据格式是: [ {time:4,[{name:"技术响应时长",value:50%}],{name:"排除故障时长",value:50%}]},{time:5,value:40%},value:60%}]},{time:6,value:70%},value:30%}]} ]
那么前台创建曲线是 protected function getMEMPerfDataResult(event:BusinessManagerEvent):void { var arrcol:ArrayCollection = event.object as ArrayCollection; if(arrcol && arrcol.length>0){ var dataProvider:ArrayCollection = new ArrayCollection(); var timeChartVo:TimeChartVO = arrcol[0] as TimeChartVO; var array:Array = []; var lineSeries:LineSeries; for (var i:int = 0; i < timeChartVo.series.length; i++) { lineSeries = new LineSeries(); lineSeries.displayName = "物理内存利用率"; lineSeries.yField="value"+i; lineSeries.setStyle("form","curve"); lineSeries.setStyle("lineStroke",seriesStrok0); /* if(i<7){ lineSeries.setStyle("lineStroke",seriesStrok0); } */ array.push( lineSeries); } ///// 设置系列数量。 memoryUsageChart.series = array; for (i = 0; i < arrcol.length; i++) { timeChartVo = arrcol[i] as TimeChartVO; var obj:Object = {}; obj.lineTime = timeChartVo.lineTime; for(var j:int = 0;j<timeChartVo.series.length;j++){ obj["value"+j] = SeriesVO(timeChartVo.series[j]).value; } dataProvider.addItem(obj); } memoryUsageChart.dataProvider = dataProvider; } }
相应的MXML: <mx:LineChart id="memoryUsageChart" color="#00A7FF" width="90%" height="80%" showDataTips="true" horizontalCenter="0" verticalCenter="0"> <mx:backgroundElements> <mx:GridLines gridDirection="both"> <mx:verticalStroke> <s:SolidColorStroke color="#274E79"/> </mx:verticalStroke> <mx:horizontalStroke> <s:SolidColorStroke color="#274E79"/> </mx:horizontalStroke> </mx:GridLines> </mx:backgroundElements> <mx:horizontalAxis> <mx:CategoryAxis id="memoryCategoryAxis" categoryField="lineTime" title="时间"/> </mx:horizontalAxis> <mx:verticalAxis> <mx:LinearAxis id="memorylinearAxis" baseAtZero="false" title="内存利用率"/> </mx:verticalAxis> <mx:verticalAxisRenderers> <mx:AxisRenderer id="memoryvAxisRenderer" axis="{memorylinearAxis}" axisStroke="{vstroke}" /> </mx:verticalAxisRenderers> <mx:series> <mx:LineSeries yField="value" form="segment" displayName="内存利用率" lineStroke="{seriesStrok1}"/> </mx:series> </mx:LineChart> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |