Filtering data shown on linechart in flex.

Question

Hi guys, 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. any help please?

Answer 1

Can you post the code?

Answer 2

Are you refreshing the dataProvider with the sliderChange event? You will want to. Your code got truncated.

[as an FYI you can edit original post to update with code and such. it makes for easier reading]

Answer 3

eh... i can't seem to change the original post.. cos mine isn't an open id.

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.

The data is there, the axis are all set, alpha is set to 0. but 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...

these are my codes

---

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

sorry for the messiness.:(

Answer 4

Try this for your 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;
}

Answer 5

Hey guys how to get input dynamically from the user for line and other sort of graphs in flex...??