actionScript 控制lineChart图表的生成

这里设计到6个lineChart图表的生成， compareViewVoList集合中存放的是CompareViewVO实体类，
public class CompareViewVO
{
public function CompareViewVO()
{
}
private var _viewId:int;
private var _viewName:String;
private var _compareViewVOCells:ArrayCollection;
｝
compareViewVOCells中存放的是CompareViewVOCell

public class CompareViewVOCell
{
public function CompareViewVOCell()
{
}
//视图名称，即问卷或者维度的描述
private var _viewName:String;
//该视图得分
private var _score:Number;
//视图得分描述
private var _description:String;
//云图标志
private var _cloudFlag:String;
//视图Id，即问卷或者维度的Id
private var _viewId:int;
//时间日期
private var _datePeroid:String;
｝

主要思路是  把后台的大的list结合 拆分成 6个符合lineChart的 dataProvide的小集合，
然后动态的生成6个lineChart， 没3个lineChart放在一个 HGroup里面  在把HGroup放在borderContainer里面



public function showLineChartView(compareViewVoList:ArrayCollection):void {
for(var i:int=0; i<compareViewVoList.length; i++) {
if(i%3==0) {  //每三个lineChart之后 换行  重新生成一个HGroup
var hgroup:HGroup = new HGroup();
hgroup.width = borderContainer.width;
if(i>0) {
//如果不是第一个HGroup，控制距离上方的距离
hgroup.paddingTop=200;
}
}
//拆分成六个小的dataProvide集合
var linechartData:ArrayCollection = new ArrayCollection;
var compareViewVo:CompareViewVO = compareViewVoList[i] as CompareViewVO;
var compareViewVoCellList:ArrayCollection = compareViewVo.compareViewVOCells;
for(var n:int=0; n<compareViewVoCellList.length; n++) {
var object:Object = new Object();
var compareViewVoCell:CompareViewVOCell = compareViewVoCellList[n] as CompareViewVOCell;
object.time = compareViewVoCell.datePeroid;
object[compareViewVoCell.viewName] = compareViewVoCell.score;
linechartData.addItem(object);
}
//产生一个lineChart
var lineChart:LineChart = new LineChart();


var lineSerisArr:Array = new Array();
var series:LineSeries = new LineSeries();
series.displayName = compareViewVo.viewName;
series.yField = compareViewVo.viewName;
//控制折线图线条的粗细和颜色
var scs:SolidColorStroke = new SolidColorStroke();
//细条的粗细程度
scs.weight = 2;
// scs.alpha = 0.2;
//线条的颜色
scs.color=0x045000;
series.setStyle("lineStroke",scs);
series.setStyle("lineStroke",scs);

lineSerisArr.push(series);

lineChart.dataProvider = linechartData;
//控制折线图的 宽和高
lineChart.width = 320;
lineChart.height = 200;
lineChart.showDataTips = true;
lineChart.series = lineSerisArr;
lineChart.seriesFilters=[];


//控制图表的水平方向
var categoryAxis:CategoryAxis = new CategoryAxis();
categoryAxis.categoryField="time";
//横轴显示什么字，  比如横轴提示时间
categoryAxis.title = compareViewVo.viewName;
lineChart.horizontalAxis = categoryAxis;

//控制图表的垂直方向
var linearAxis:LinearAxis = new LinearAxis();
linearAxis.minimum = 0;
linearAxis.maximum = 200;
//纵轴显示什么提示字  ，比如得分
linearAxis.title = "得分";

lineChart.verticalAxis = linearAxis;

var legend:Legend = new Legend();
legend.dataProvider = linechartData;
//本来想控制  纵轴的字体样式，  但不知道怎么控制，还在实验当中，知道的请留个言
legend.legendItemClass = FontLegendItem;
//当点击单个lineChart的时候切换到这个lineChart的大的视图里面去
lineChart.addEventListener(MouseEvent.CLICK,clickHandler);
hgroup.addElement(lineChart);
if((i+1)%3 == 0) {
//如果HGroup中已经存放3个lineChart，则添加到borderContainer 中去
borderContainer.addElement(hgroup);
hgroup = null;
} else if(compareViewVoList.length%3>0 && compareViewVoList.length-(i+1)<3) {
//当到最后  不满三个的时候 也添加到borderContai
borderContainer.addElement(hgroup);
}
}
}