创建道场图表动态

Question

您好我需要以这样的方式来创建道场图表，他们把自己的 一系列值从某些输入框和图表改变 automatically.So这个概念我继续这样做： -

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();}; 

然后我调用这个函数每当价值的变化： -

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

被称为

的HTML看起来像THI S： -

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

下面是文本框，其改变值： -

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

我想要的是什么，只要在此输入框中的值发生变化， 功能showchart被调用，目前的情节是 自动更改为显示新值，但发生了什么事情是 ，我得到一个新的图表，这似乎很自然..我会 hav e破坏旧图表，然后重新创建新图表，如果有的话请告诉我如何。

Answer 1

在showChart函数中，每次使用new dojox.charting.Chart2D("showgoals")调用该函数时都会创建一个新图表。如果您想更新图表，您可以拨打updateSeries更新系列数据并再次致电render()更新图表。

的代码可能看起来象下面这样：

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(); 
}