动态添加ColumnSeries不起作用

时间:2013-05-21 23:09:35

标签: flex flex-charting

我创建了以下代码来动态创建不同的系列:

<?xml version="1.0" encoding="utf-8"?>
    <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"  
        creationComplete="application1_creationCompleteHandler(event)"
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
        <fx:Script><![CDATA[
            import mx.charts.series.ColumnSeries;
            import mx.collections.ArrayCollection;
            import mx.collections.Sort;
            import mx.collections.SortField;
            import mx.events.FlexEvent;

            [Bindable]
            public var Loc01:ArrayCollection = new ArrayCollection([
                {date:"2002", close:41.87, loc: "Location 01"},
                {date:"2005", close:48.06, loc: "Location 01"},
                {date:"2006", close:48.06, loc: "Location 01"},
                {date:"2002", close:157.59, loc: "Location 02"},
                {date:"2003", close:160.3, loc: "Location 02"},
                {date:"2003", close:45.74, loc: "Location 01"},
                {date:"2004", close:42.77, loc: "Location 01"},
                {date:"2004", close:150.71, loc: "Location 02"},
                {date:"2002", close:45.74, loc: "Location 03"},
                {date:"2003", close:42.77, loc: "Location 03"},
                {date:"2004", close:150.71, loc: "Location 03"},
                {date:"2005", close:156.88, loc: "Location 02"}
            ]);

        protected function application1_creationCompleteHandler(event:FlexEvent):void
        {
            // TODO Auto-generated method stub
            var obj:Object;
            var arr:Array = [];
            var i:int;
            var ac1:ArrayCollection;
            var NS:ColumnSeries;
            var sortA:Sort = new Sort();
            var sortByLocation:SortField = new SortField("loc",false,false,false);
            var sortByDate:SortField = new SortField("date", true, false, false);

            sortA.fields=[sortByLocation, sortByDate];
            Loc01.sort=sortA;

            Loc01.refresh();

            i=0;
            arr[i] = Loc01[0].loc;
            for each(obj in Loc01){
                if(arr[i] != obj.loc)
                {
                    i++;
                    arr[i] = obj.loc;
                }
            }
            var str: String;
            i=0;
            for each(str in arr){
                ac1 = new ArrayCollection();
                for each(obj in Loc01){
                    if(str == obj.loc)
                    {
                        ac1.addItem(obj);
                    }
                }
                ac1.refresh();
                if(!myChart.series[i])
                    myChart.series.push(new ColumnSeries());
                NS = myChart.series[i];
                NS.dataProvider = ac1;
                NS.yField = "close";
                NS.horizontalAxis = h1; 
                NS.displayName = str;
                NS.verticalAxis = v1;
                NS.id = "cs" + i.toString();
                i++;
            }

        }

    ]]></fx:Script>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <mx:Panel x="49" y="30" width="868" title="Column Chart With Multiple Axes">
        <!--mx:Legend width="769" dataProvider="{myChart}"/-->
        <mx:ColumnChart id="myChart" width="601" showDataTips="true" dataProvider="{Loc01}">
            <mx:horizontalAxis>
                <mx:CategoryAxis id="h1" categoryField="date"/>
            </mx:horizontalAxis>

            <mx:horizontalAxisRenderers>
                <mx:AxisRenderer placement="bottom" axis="{h1}"/>
            </mx:horizontalAxisRenderers>

            <mx:verticalAxisRenderers>
                <mx:AxisRenderer placement="left" axis="{v1}"/>
            </mx:verticalAxisRenderers>
            <mx:verticalAxis>
                <mx:LinearAxis id="v1" minimum="30" maximum="170"/>           
            </mx:verticalAxis>
            <mx:series>
                <mx:ColumnSeries id="cs0"/>
            </mx:series>
        </mx:ColumnChart>
    </mx:Panel>
</s:Application>

硬编码的ColumnSeries(第一个)工作正常,但动态创建的下一个系列不起作用。我的代码有什么问题?请帮忙。

1 个答案:

答案 0 :(得分:0)

我替换了代码的以下部分:

 if(!myChart.series[i])
      myChart.series.push(new ColumnSeries());

使用以下行:

 if(!myChart.series[i])
 {
      var tmp:Array = myChart.series;   
      tmp.push(new ColumnSeries());  
      myChart.series = tmp;   
      myChart.invalidateSeriesStyles();
 }

现在它运作良好。