在 Flex 中清除/清空折线图

Question

我有一个带有日期时间轴的 Flex 折线图。我通过动作脚本将数据提供者设置为该折线图。图表被绘制出来。当我向数据提供者分配空值以使图表变空时，就会出现问题。

实际代码看起来与下面的代码类似：

var actualValues:XMLList=flowChartDP.upFlows;
var localSeries1:LineSeries = new LineSeries();
localSeries1.dataProvider = actualValues;
localSeries1.yField = "flow";
localSeries1.xField = "time";
localSeries1.setStyle("form","curve");
var currentSeries1:Array =lineChart.series;
currentSeries1.push(localSeries1);
lineChart.series = currentSeries1;
var actualValues2:XMLList=flowChartDP.downFlows;
var localSeries2:LineSeries = new LineSeries();
localSeries2.dataProvider = actualValues2;
localSeries2.yField = "flow";
localSeries2.xField = "time";
localSeries2.setStyle("form","curve");
var currentSeries2:Array =lineChart.series;
currentSeries2.push(localSeries2);
lineChart.series = currentSeries2;

我将以相同的方式添加另外两个系列到折线图。虽然我猜这不是编写代码的最佳方法，但这个方法工作得很好。 问题在于重置图表。

我有一个按钮，单击时会执行以下操作： lineChart.dataprovider=null; lineChart.series=null;

但我的 Flash 播放器（FP 10 调试器版本）抛出以下错误

TypeError: Error #1009: Cannot access a property or method of a null object reference.
    at mx.charts::AxisRenderer/measureHorizontalGutters()[E:\dev\4.0.0\frameworks\projects\datavisualization\src\mx\charts\AxisRenderer.as:2275]
    at mx.charts::AxisRenderer/calcRotationAndSpacing()[E:\dev\4.0.0\frameworks\projects\datavisualization\src\mx\charts\AxisRenderer.as:1889]
    at mx.charts::AxisRenderer/adjustGutters()[E:\dev\4.0.0\frameworks\projects\datavisualization\src\mx\charts\AxisRenderer.as:1565]
    at mx.charts.chartClasses::CartesianChart/updateAxisLayout()[E:\dev\4.0.0\frameworks\projects\datavisualization\src\mx\charts\chartClasses\CartesianChart.as:2133]
    at mx.charts.chartClasses::CartesianChart/updateDisplayList()[E:\dev\4.0.0\frameworks\projects\datavisualization\src\mx\charts\chartClasses\CartesianChart.as:1391]
    at mx.core::UIComponent/validateDisplayList()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\core\UIComponent.as:8531]
    at mx.managers::LayoutManager/validateDisplayList()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\managers\LayoutManager.as:663]
    at mx.managers::LayoutManager/doPhasedInstantiation()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\managers\LayoutManager.as:736]
    at mx.managers::LayoutManager/doPhasedInstantiationCallback()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\managers\LayoutManager.as:1072]

解决方案是什么？ 时不会引发错误

lineChart.series=null;

删除 。但该声明

lineChart.dataprovider=null;

也不会使图表变空。

Answer 1

下面是我创建的一个简单的应用程序，用于重新创建您的问题。将 dataProvider 设置为 null 确实会清除图表，对我来说没有任何例外。运行一下看看。我说你的问题出在别的地方。

<?xml version="1.0" encoding="utf-8"?>
<s:Application
   xmlns:fx="http://ns.adobe.com/mxml/2009" 
   xmlns:s="library://ns.adobe.com/flex/spark"             
   xmlns:mx="library://ns.adobe.com/flex/mx" >

    <fx:Script><![CDATA[

        import mx.collections.ArrayCollection;
        [Bindable]
        public var expenses:ArrayCollection = new ArrayCollection([
            {Month:"Jan", Profit:2000, Expenses:1500, Amount:450},
            {Month:"Feb", Profit:1000, Expenses:200, Amount:600},
            {Month:"Mar", Profit:1500, Expenses:500, Amount:300}
        ]);


        protected function button1_clickHandler(event:MouseEvent):void
        {
            myChart.dataProvider = null;

        }

    ]]></fx:Script>

    <s:layout>
        <s:VerticalLayout />
    </s:layout>


    <mx:Panel title="Line Chart">
        <mx:LineChart id="myChart" 
                      dataProvider="{expenses}" 
                      showDataTips="true"
                      >
            <mx:horizontalAxis>
                <mx:CategoryAxis 
                    dataProvider="{expenses}" 
                    categoryField="Month"
                    />
            </mx:horizontalAxis>
            <mx:series>
                <mx:LineSeries 
                    yField="Profit" 
                    displayName="Profit"
                    />
                <mx:LineSeries 
                    yField="Expenses" 
                    displayName="Expenses"
                    />
            </mx:series>
        </mx:LineChart>
        <mx:Legend dataProvider="{myChart}"/>
    </mx:Panel>

    <s:Button click="button1_clickHandler(event)" label="Clear" />

</s:Application>