title: Filtering data shown on linechart
body: <p>I am working on a line chart on flex which enable me to view the progress of data according to the year. I have tried using a slider to filter but it doesn't seemed to work.</p>
  
  <p>I am not exactly filtering the dataprovider, but the alpha. My function will retrieve all the information from my array collection, but set the alpha to 0, so when user drags the slider, if the year falls below that particular year, it will display the data, which i then set the alpha to 100.</p>
  
  <p>The data is there, the axis are all set, alpha is set to 0. The problem is it doesn't display the information line by line as what I wanted it to be, instead, it display the whole graph only until I drag the slider to the end.</p>
  
  <hr>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"&gt;
   &lt;mx:Script&gt;
   &lt;![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&lt;=slider.value || item.Year==slider.value)
                  {
                  pro.alpha=100;
                  return result;
                  }
              return result;
  
  
              }
  
    ]]&gt;&lt;/mx:Script&gt;
      &lt;mx:VBox horizontalCenter="0" top="10" horizontalAlign="center" height="100%"&gt;
          &lt;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"/&gt;
          &lt;mx:Panel title="Line Chart with One Shadow"&gt;
          &lt;mx:LineChart id="myChart" dataProvider="{expenses}" showDataTips="true" &gt;
                &lt;mx:seriesFilters&gt;
                  &lt;mx:Array/&gt;
                &lt;/mx:seriesFilters&gt;
                &lt;mx:horizontalAxis&gt;
                   &lt;mx:CategoryAxis
                        dataProvider="{expenses}"
                        categoryField="Year"
                   /&gt;
                &lt;/mx:horizontalAxis&gt;
                &lt;mx:series&gt;
                   &lt;mx:LineSeries id="pro" alpha="0"
                        yField="Profit"
                        displayName="Profit"
                   /&gt;
                &lt;/mx:series&gt;
             &lt;/mx:LineChart&gt;
  
             &lt;mx:Legend dataProvider="{myChart}" /&gt;
          &lt;/mx:Panel&gt;
      &lt;/mx:VBox&gt;
  
  &lt;/mx:Application&gt;
  </code></pre>