Question

这是我的问题我有一个带有属性“Month”的arraycollection，你可以找到类似的数据月：“2月”5次。如果我运行我的应用程序数据将不会出现在屏幕上“2月”，即柱形图将不会显示。谁能告诉我解决这个问题的原因或可能的解决方法？请在下面找到代码： -

<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>

Answer 1

<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>

做这样的事情，希望这会有所帮助。

Answer 2

我通过使用ZERO WIDTH SPACE（Unicode 0x200B）字符，以不可见的方式使标签不同，从而解决了类似情况。像这样：

{{1}}

弹性图表具有重复条目的ColumnChart不可见

2 个答案: