Question

我正在制作flex的折线图，这使我能够根据年份查看数据的进度。我尝试使用滑块进行过滤，但似乎没有效果。

我不是完全过滤数据提供者，而是alpha。我的函数将从我的数组集合中检索所有信息，但是将alpha设置为0，因此当用户拖动滑块时，如果年份低于特定年份，它将显示数据，然后我将alpha设置为100。

数据存在，轴全部设置，alpha设置为0.问题是它不会按照我想要的那样逐行显示信息，相反，它只显示整个图形，直到我将滑块拖到最后。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 <mx:Script>
 <![CDATA[
     import mx.collections.ArrayCollection;
     import mx.rpc.events.ResultEvent;

     [Bindable]
     public var expenses:ArrayCollection = new ArrayCollection([
        {Year:"1990", Profit:2000 },
        {Year:"1991", Profit:1000 },
        {Year:"1992", Profit:1500 },
        {Year:"1993", Profit:2100 },
        {Year:"1994", Profit:2500 },
        {Year:"1995", Profit:1500 },
        {Year:"1996", Profit:1900 },
             ]);


            private function init():void {
                    expenses.filterFunction = sliderFilterFunc;
                    expenses.refresh();
                }

            private function sliderFilterFunc(item:Object):Boolean{
                var result:Boolean = true;
                pro.alpha=0;
                if(item.Year<=slider.value || item.Year==slider.value)
                {
                pro.alpha=100;
                return result;
                }
            return result;


            }

  ]]></mx:Script>
    <mx:VBox horizontalCenter="0" top="10" horizontalAlign="center" height="100%">
        <mx:HSlider id="slider" minimum="1990" maximum="1996" value="220" liveDragging="true" change="init()" width="570" snapInterval="1" dataTipPrecision="0" labels="['1990','1996']" tickInterval="1"   themeColor="#000000" borderColor="#FFFFFF" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#000000, #000000, #FFFFFF, #1400D1]" height="48" styleName="myDataTip"/>
        <mx:Panel title="Line Chart with One Shadow">
        <mx:LineChart id="myChart" dataProvider="{expenses}" showDataTips="true" >
              <mx:seriesFilters>
                <mx:Array/>
              </mx:seriesFilters>
              <mx:horizontalAxis>
                 <mx:CategoryAxis
                      dataProvider="{expenses}"
                      categoryField="Year"
                 />
              </mx:horizontalAxis>
              <mx:series>
                 <mx:LineSeries id="pro" alpha="0"
                      yField="Profit"
                      displayName="Profit"
                 />
              </mx:series>
           </mx:LineChart>

           <mx:Legend dataProvider="{myChart}" />
        </mx:Panel>
    </mx:VBox>

</mx:Application>

Answer 1

尝试使用sliderFilterFunc：

private function sliderFilterFunc(item:Object):Boolean{
    var result:Boolean = true;
    pro.alpha=100;
    if(item.Year<=slider.value || item.Year==slider.value)
    {
        return false;
    }
    return result;
}

过滤线图上显示的数据

1 个答案: