Фильтрация данных, показанных на линейной диаграмме в flex

Question

Я работаю над линейной диаграммой flex, которая позволяет мне просматривать ход данных в соответствии с годом. Я попытался использовать слайдер для фильтрации, но он, похоже, не работает. любая помощь, пожалуйста? Я точно не фильтрую датаподаватель, а альфу. Моя функция будет извлекать всю информацию из моей коллекции массивов, но установите альфа-значение 0, поэтому, когда пользователь перетащит ползунок, если год опустится ниже определенного года, он отобразит данные, которые я установил для альфа-100.

Данные есть, все оси установлены, альфа установлена ​​в 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

Вы, кажется, используете даты как ось x, ползунок может «скользить» между числовыми значениями.

Что бы я сделать, это мои расходы ArrayCollection на:

public var expenses:ArrayCollection = new ArrayCollection([ 
    {Year: new Date(1990), Profit:2000 }, 
    {Year: new Date(1991), Profit:1000 }, 
    ... 

Тогда для вашей функции фильтра:

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

Кроме того, вы можете быть уверены, что вы хотите установить альфа в 0 вместо просто отфильтровать точки данных? Если вы хотите, чтобы сжать ваш ArrayCollection (не волнуйтесь, это сжимается ArrayCollection, а не источник, массив), вы можете просто сделать:

private function sliderFilterFunc(item:Object):Boolean { 
    return = item.Year.getTime() <= slider.value; 
} 

Наконец, вы должны также установить свой собственный dataTipFunction для слайдера поэтому вместо того, чтобы видеть цифры, они видят фактическую дату.

Answer 2

Я создал библиотеку Flex (DataFilterLib), которая заботится обо всех процессах фильтрации, полностью в MXML. Эта библиотека бесплатна, вы можете найти подробную информацию о проекте: http://code.google.com/p/flex-datafilterlib/ Если вы хотите взглянуть на примеры, все они находятся на странице проекта (источник доступен): Проверьте примеры в Интернете, если вы хотите увидеть как фильтровать по нескольким критериям, используя различные компоненты пользовательского интерфейса Flex (CheckBox, Slider, List, ...). Используя эти фильтры с помощью слайдера (2-х пальца), вы можете легко отфильтровать свои данные, и они автоматически отразятся на вашей диаграмме.

Thanks, Fabien