Flex LineChart - Как создать LineSeries из уникальных значений в ArrayCollection

Я пытался найти способ создать LineChart, который содержит множество LineSeries на основе данных в ArrayCollection.

Чтобы быть более конкретным, допустим, что у нас есть ArrayCollection как таковая:

public var myArray: ArrayCollection = new ArrayCollection ([{State: "Georgia", Year: "2011", Percent: 18}, {State: "Georgia", Year: "2010", Percent: 10}, {State: " Мэриленд », Год:« 2009 », Процент: 15}, {Штат:« Мэриленд », Год:« 2008 », Процент: 15}]);

Я хочу создать линейную диаграмму, содержащую две строки: одну для Джорджии и одну для Мэриленда. Строка для Грузии будет содержать данные за 2011 и 2010 годы в одной строке. Линия Мэриленд будет содержать данные за 2009 и 2008 годы в одной строке.

Я думал, что мне, вероятно, придется создать LineSeries динамически, но не знал, как заставить ArrayCollection сгруппировать данные на основе состояний.

Любые предложения будут полезны. Спасибо


linechart arraycollection apache-flex lineseries
person anad2312    schedule 05.11.2012    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Посмотрите этот пример. Вкратце, вам нужно присвоить каждой серии dataFunction при ее создании.

Изменить: на самом деле ваши данные достаточно просты, вы, вероятно, можете использовать xField / yField.

person Amy Blankenship    schedule 05.11.2012
comment
Использование простого xField / yField даст мне одну единственную строку со всеми данными на ней. Я хочу иметь две строки, одну для Мэриленда и одну для Джорджии (в этом сценарии), основанные на состояниях в arrayCollection. - person anad2312; 06.11.2012
comment
Тогда вам понадобится dataFunction. - person Amy Blankenship; 06.11.2012

arrow_upward
0
arrow_downward

Не уверен, что это самый чистый способ сделать это, но вот что я придумал:

<fx:Script>
    <![CDATA[
        import mx.charts.series.LineSeries;
        import mx.collections.ArrayCollection;

        [Bindable]
        private var appData:ArrayCollection=new ArrayCollection([{State: "Georgia", Year: 2000, Percent: 15}, {State: "Georgia", Year: 2001, Percent: 12}, {State: "Georgia", Year: 2002, Percent: 5}, {State: "Maryland", Year: 1999, Percent: 12}, {State: "Maryland", Year: 2000, Percent: 7}]);

        protected function creationComplete(event:Event):void
        {
            var states:Array=new Array("Georgia", "Maryland");
            var series:Array=new Array();

            for each (var state:Object in states)
            {
                var data:ArrayCollection=new ArrayCollection();
                var ls:LineSeries=new LineSeries();

                for (var i:int=0; i < appData.length; i++)
                {
                    var currItem:String=appData.getItemAt(i).State;

                    if (currItem == state)
                    {
                        data.addItem(appData.getItemAt(i));
                    }
                }

                ls.yField="Percent";
                ls.xField="Year";
                ls.displayName=state.toString();
                ls.dataProvider=data;
                series.push(ls);
            }

            linechart.series=series;
        }
    ]]>
</fx:Script>

<mx:Panel title="US States Data"
          height="100%"
          width="100%"
          layout="horizontal">

    <mx:LineChart id="linechart"
                  height="100%"
                  width="100%"
                  paddingLeft="5"
                  paddingRight="5"
                  showDataTips="true"
                  dataProvider="{appData}">

        <mx:horizontalAxis>
            <mx:CategoryAxis categoryField="Year"/>
        </mx:horizontalAxis>

    </mx:LineChart>

    <mx:Legend dataProvider="{linechart}"/>

</mx:Panel>
person anad2312    schedule 06.11.2012