гибкая диаграмма ColumnChart с повторяющейся записью не видна - PullRequest
Новая
       18

гибкая диаграмма ColumnChart с повторяющейся записью не видна

1 голос
/ 28 марта 2012

Вот моя проблема. У меня есть коллекция массивов с атрибутом «Месяц» с похожими данными, которые вы можете найти в Месяце: «Февраль» 5 раз.Если я запустлю свое приложение, данные не будут отображаться на экране для «февраля», т.е. столбчатая диаграмма не будет отображаться.Может кто-нибудь сказать мне причину или возможное решение этой проблемы?Пожалуйста, найдите код ниже: - 

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

        [Bindable] private var expenses:ArrayCollection = new
            ArrayCollection([
                {Month:"Jan", Profit:1000, Expenses:1500, Amount:450},
                {Month:"Feb", Profit:500, Expenses:200, Amount:600},
                {Month:"Feb", Profit:1500, Expenses:500, Amount:300},
                {Month:"Feb", Profit:2000, Expenses:1500, Amount:450},
                {Month:"Feb", Profit:1000, Expenses:200, Amount:600},
                {Month:"Feb", Profit:1500, Expenses:500, Amount:300},
                {Month:"Feb", Profit:2000, Expenses:1500, Amount:450},
                {Month:"Aug", Profit:1000, Expenses:200, Amount:600},
                {Month:"Sept", Profit:1500, Expenses:500, Amount:300},
                {Month:"Oct", Profit:2000, Expenses:1500, Amount:450},
                {Month:"Nov", Profit:1000, Expenses:200, Amount:600},
                {Month:"Dec", Profit:1500, Expenses:500, Amount:300}
            ]);

        private function clickHandler():void
        {
            var columnSeries:Array = new Array();
            var series:ColumnSeries = new ColumnSeries();
            categoryAxis.categoryField = series.xField = "Month";
            series.yField = "Profit";
            series.displayName = "Profit";
            columnSeries.push(series);
            myChart.series = columnSeries;
            series.percentWidth = 100;
            series.percentHeight = 100;

            myChart.dataProvider = expenses;
        }

    ]]>
</mx:Script>

<mx:VBox horizontalAlign="center" width="100%" height="100%" creationComplete="clickHandler()">
    <mx:ColumnChart id="myChart" width="90%" showDataTips="true" height="90%"  >
        <mx:horizontalAxis>
            <mx:CategoryAxis id="categoryAxis" categoryField="Month" />
        </mx:horizontalAxis>
    </mx:ColumnChart>
</mx:VBox>

Ответы [ 2 ]

2 голосов
/ 28 марта 2012 
<fx:Script>
        <![CDATA[
            import mx.charts.series.ColumnSeries;
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            [Bindable] private var expenses:ArrayCollection = new
                ArrayCollection([
                    {id:1, Month:"Jan", Profit:1000, Expenses:1500, Amount:450},
                    {id:2, Month:"Feb", Profit:500, Expenses:200, Amount:600},
                    {id:3, Month:"Feb", Profit:1500, Expenses:500, Amount:300},
                    {id:4, Month:"Feb", Profit:2000, Expenses:1500, Amount:450},
                    {id:5, Month:"Feb", Profit:1000, Expenses:200, Amount:600},
                    {id:6, Month:"Feb", Profit:1500, Expenses:500, Amount:300},
                    {id:7, Month:"Feb", Profit:2000, Expenses:1500, Amount:450},
                    {id:8, Month:"Aug", Profit:1000, Expenses:200, Amount:600},
                    {id:9, Month:"Sept", Profit:1500, Expenses:500, Amount:300},
                    {id:10, Month:"Oct", Profit:2000, Expenses:1500, Amount:450},
                    {id:11, Month:"Nov", Profit:1000, Expenses:200, Amount:600},
                    {id:12, Month:"Dec", Profit:1500, Expenses:500, Amount:300}
                ]);

            private function clickHandler():void
            {
                categoryAxis.labelFunction = labelFunction;
                var columnSeries:Array = new Array();
                var series:ColumnSeries = new ColumnSeries();
                categoryAxis.categoryField = series.xField = "id";
                series.yField = "Profit";
                series.displayName = "Profit";
                columnSeries.push(series);
                myChart.series = columnSeries;
                series.percentWidth = 100;
                series.percentHeight = 100;

                myChart.dataProvider = expenses;
            }



            protected function labelFunction(value:Object, pre:Object, axis:Object, item:Object):Object 
            {
                return item.Month;
            }

        ]]>
    </fx:Script>


    <mx:VBox horizontalAlign="center" width="100%" height="100%" creationComplete="clickHandler()">
        <mx:ColumnChart id="myChart" width="90%" showDataTips="true" height="90%"  >
            <mx:horizontalAxis>
                <mx:CategoryAxis id="categoryAxis" categoryField="id"/>
            </mx:horizontalAxis>
        </mx:ColumnChart>
    </mx:VBox>

Сделай что-нибудь подобное, надеюсь, это поможет.

0 голосов
/ 08 марта 2016

Я решил похожую ситуацию, изменив метки так, чтобы они не были видны, с помощью символа ZERO WIDTH SPACE (Unicode 0x200B).Как то так: 

{id:1, Month:"Jan", Profit:1000, Expenses:1500, Amount:450},
{id:2, Month:"Feb", Profit:500, Expenses:200, Amount:600},
{id:3, Month:"Feb\u200B", Profit:1500, Expenses:500, Amount:300},
{id:4, Month:"Feb\u200B\u200B", Profit:2000, Expenses:1500, Amount:450},
...