créer des graphiques de façon dynamique dojos

Question

Salut je dois créer des graphiques de manière dojos d'une telle sorte qu'ils prennent leur les valeurs de la série de certaines zones d'entrée et les changements de tableau automatically.So avec ce concept je me suis rendu à faire avant ceci: -

  var showChart= function(){
   var thevalue=dijit.byId('myvalue').get('value');//gets thevalue from the dijit numbertextbox
   var chart1 = new dojox.charting.Chart2D("showgoals");
   chart1.addPlot("default", {type: "Lines"});
   chart1.addAxis("x");
   chart1.addAxis("y", {vertical: true});
   chart1.addSeries("Series 1", [thevalue, 2, 2, 3, 4, 5, 5, 7]);
   chart1.render();};

Alors j'appelle cette fonction à chaque fois que la valeur change: -

      dojo.connect(dojo.byId('myvalue'), "onchange",showChart);//whenever value changes the showChart function

est appelé

Les regards html comme ceci: -

<div dojoType="dijit.layout.ContentPane" region="center">
           <div id="showgoals" style="width: 250px; height:150px;" class="graph1"></div>

Le dessous est la zone de texte qui change de valeur: -

<input id="myvalue" type="text" dojoType="dijit.form.NumberTextBox" name="myvalue"value="1000000"  required="true"
                           invalidMessage="Only Numbers allowed"/><br/><br/>

Ce que je voulais était que chaque fois que la valeur dans cette zone d'entrée change, la fonction showChart est appelée et l'intrigue est présente changé automatiquement pour afficher les nouvelles valeurs, mais ce qui se passe est que je reçois un nouveau tableau tout à fait, ce qui semble tout à fait naturel .. Vais-je à détruire l'ancien tableau puis recréer le nouveau plan, le cas échéant s'il vous plaît me dire comment.

Answer 1

Dans la fonction showChart, une nouvelle carte est créée chaque fois que la fonction est appelée à l'aide new dojox.charting.Chart2D("showgoals"). Si vous souhaitez mettre à jour le graphique, vous pouvez appeler updateSeries aux données de mise à jour de la série et appel render() à nouveau pour mettre à jour le tableau.

Le code peut ressembler à ceci:

var chart1 = null;
var showChart = function() {
  var thevalue=dijit.byId('myvalue').get('value');
  if (!chart1) {
     var chart1 = new dojox.charting.Chart2D("showgoals");
     chart1.addPlot("default", {type: "Lines"});
     chart1.addAxis("x");
     chart1.addAxis("y", {vertical: true});
     chart1.addSeries("Series 1", [thevalue, 2, 2, 3, 4, 5, 5, 7]);
  } 
  else {
     chart1.updateSeries("Series 1", [thevalue, 2, 2, 3, 4, 5, 5, 7]);
  }
  chart1.render();
}