javascript animated linechart using RGraph

Question

I am using RGraph to draw a line chart with data from a DB. I can do it using a single request when the webpage loads, but I have been unable to update the graph, since the new line superimposes with the existing line.Is there any way to clear the canvas and draw it again with the new values?. This is the code for the first request:

   function drawLine(){

 var masterArray=new Array;

 $.get('SearchDB',{action:'timed'},function(responseText){
     var array= responseText.split(';');

          for (var i=0; i<array.length; i++){

                var intermediate = array[i].split(',');                 
                var map= new Object();

                map["Id"]= intermediate[0];;
                map["LevelValue"]=intermediate[1];
                map["InitialDate"]=intermediate[2];

                masterArray.push(map);
          };

                      var yvalues= new Array();
              var xvalues=new Array();
              var variable;

              for(var i=0; i<8;i++){    

                yvalues[i]=parseInt(masterArray[7-i]["LevelValue"]);

                variable=   masterArray[7-i]["InitialDate"].split(' ');

                xvalues[i]=variable[1];
               } 




                Line = new RGraph.Line('cvs', yvalues);
                Line.Set('chart.hmargin', 10);
                Line.Set('chart.tickmarks', 'endcircle');
                Line.Set('chart.labels', xvalues);
                Line.Draw();

                RGraph.Register(Line);

 });  


}

Answer 1

You don't need this:

RGraph.Register(Line);

And right before you create the object you can reset the canvas:

var canvas = document.getElementById('cvs');
RGraph.Reset(canvas);