Probleme avec un LineSeries affichant 3000 valeurs en Flex

Probleme avec un LineSeries affichant 3000 valeurs en Flex - Flash/ActionScript - Programmation

Marsh Posté le 20-06-2011 à 16:21:46    

Bonjour à tous,  
je vais essayer de décrire mon problème .
Dans le cadre d'un projet je dois construire un graphique temps Réel en utilisant flex.  
J'ai donc essayer trouver un composant répondant à ma problématique , j'ai trouver cela sur le net en cherchant un peu :
http://www.iwobanas.com/2009/07/sc [...] tscroller/
 
-J'ai donc fait quelque test avec ce composant et tout allait bien, on peut zoomer, scroller ...  
Mais malheureusement lorsque je met le dataprovider et que je dépasse 1500 valeurs le déplacement dans le graphique est très ralentis. J'ai chercher à optimiser  le code en suivant ces règles :
http://www.adobe.com/fr/devnet/fle [...] rf_10.html
Rien y  fait les déplacements dans le graphique avec 1500 valeurs est très lent .  
Auriez vous des idées sur les optimisations à apporter .
Voici le code  :

Code :
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
  3.        xmlns:s="library://ns.adobe.com/flex/spark"
  4.        xmlns:mx="library://ns.adobe.com/flex/mx"
  5.        xmlns:charts="com.iwobanas.charts.*"
  6.        creationComplete="init()"
  7.        >
  8. <fx:Declarations>
  9.  <!-- Place non-visual elements (e.g., services, value objects) here -->
  10.  <charts:ChartScroller id="scroller" chart="{chart}" />
  11. </fx:Declarations>
  13. <fx:Script>
  14.  <![CDATA[
  15.   import com.vector.DataVector;
  17.   import flash.utils.getTimer;
  19.   import mx.collections.ArrayCollection;
  20.   import mx.core.Application;
  21.   import mx.core.FlexGlobals;
  23.   //Application.application.stage.quality = StageQuality.LOW;
  24.   //FlexGlobals.topLevelApplication.stage.quality = StageQuality.LOW;
  26.   /** Variables relatives aux évènements générés par le Timer **/
  27.   // Variable contenant un nombre généré aléatoirement compris entre 0 et 30
  28.   public var nombreGenere:Number;
  29.   // Variable contenant le nombre généré converti en int
  30.   public var nombreInt:int;
  31.   // Instanciation de l'objet Timer avec un décompte de 30 et un intervalle d'une seconde
  32.   public var monTimer:Timer = new Timer(10,3001);
  33.   public var i:uint = 0;
  34.   // Création d'un objet type ArrayCollection qui contiendra les nombres entiers
  35.   // générés aléatoirement
  36.   [Bindable]
  37.   //var valeurs:DataVector = new DataVector();
  38.   var valeurs:ArrayCollection = new ArrayCollection();
  40.   // Création d'un objet type ArrayCollection
  42.   public function init():void
  43.   {
  44.    // Ajout un écouteur sur le timer lorsque le Timer tourne
  45.    //monTimer.addEventListener(TimerEvent.TIMER, genererNombre);
  46.    // Active le timer
  47.    //monTimer.start();
  49.    trace(getTimer());
  50.    for(var j:uint = 0 ;j< 3000;j++)
  51.    {
  52.     genererNombre();
  53.     if(j == 3000)
  54.     {
  55.      trace(getTimer());
  56.      chart.dataProvider = valeurs;
  57.      chart.validateNow();
  58.      trace(getTimer());
  59.     }
  60.    }
  63.   }
  64.   public function genererNombre():void
  65.   {
  66.    i++;
  67.    // Génère un nombre aléatoire compris entre 0 et 30
  68.    nombreGenere = Math.random() * 10 ;
  69.    // Arrondi le nombre de type float  
  70.    nombreInt = Math.round(nombreGenere);
  71.    // Ajout ce nombre arrondi dans l'ArrayCollection
  72.    valeurs.addItem({y1: nombreInt, y2: valeurs.length});
  75.    //chart.validateNow();
  76.    // Affichage d'un message confirmant l'ajout
  77.    //monLab.text = "Ajout de la valeur " + nombreInt + " dans l'ArrayList";  
  79.   }
  80.  ]]>
  81. </fx:Script>
  84. <mx:Panel title="ChartScroller example - 2 series with DateTimeAxis" width="100%" height="100%">
  86.  <mx:LineChart id="chart" width="820" height="337"
  87.       gutterLeft="40" gutterRight="10"  >
  89.   <mx:series>
  90.    <mx:LineSeries id="series2" xField="y2" yField="y1" horizontalAxis="{lhAxis}"  />
  91.   </mx:series>
  93.   <mx:horizontalAxis>
  95.    <mx:LinearAxis id="lhAxis" minimum="0" maximum="10" >
  97.    </mx:LinearAxis>
  98.   </mx:horizontalAxis>
  100.   <mx:verticalAxis>
  101.    <mx:LinearAxis id="vAxis1" maximum="10" />
  102.   </mx:verticalAxis>
  104.   <mx:horizontalAxisRenderers>
  105.    <mx:AxisRenderer placement="bottom" axis="{lhAxis}" />
  106.   </mx:horizontalAxisRenderers>
  108.  </mx:LineChart>
  110. </mx:Panel>
  112. </s:WindowedApplication>


A++ merci d'avance.


---------------
Mon topic VDS/ACH
Reply

Marsh Posté le 20-06-2011 à 16:21:46   

Reply

Marsh Posté le 22-06-2011 à 23:28:31    

Personne pour m'éclairer ? ;)


---------------
Mon topic VDS/ACH
Reply

Marsh Posté le 18-07-2011 à 10:39:10    

up


---------------
Mon topic VDS/ACH
Reply

Marsh Posté le 26-07-2011 à 21:56:44    

up


---------------
Mon topic VDS/ACH
Reply

Marsh Posté le 28-07-2011 à 21:20:56    

en regardant vite fait, ta boucle est configurée tel que j n'atteindra jamais 3000 puisque tu as utiliser "<" et non "<=" à 3000...


Message édité par abais le 28-07-2011 à 21:21:18

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed