i have been using chart.js chart.js documentation
i have graph showing multiple lines. graph of changing drug concentration per unit time (s), run graph in variety of scenario's ie, realtime, x2, x4, x8, etc when next second comes along want graph update new calculated data , refresh/update chart.
//simdur duration want simulation run eg 1hr/3600secs for(t=0; t < simdur; t++) { timer(); //function awaits here next second arrive generatedata(); //calculate new data yarr; mylinechart.adddata(yarr, t); //yarr array of y values, t=time mylinechart.update(); //update chart new added data } the problem chart not refresh until finish of loop, want chart display updated data each second.
the documentation says update() should following...
calling update() on chart instance re-render chart updated values, allowing edit value of multiple existing points, render in 1 animated render loop.
if timer(); contains code in comments i.e.
(function forever() { var = new date(); var hh = now.gethours(); var mm = now.getminutes(); var ss = now.getseconds(); var g_realtimenow = (ss + (mm * 60) + (hh * 60 * 60)); //convert secs console.log("global time: " + g_realtimenow); settimeout(forever, 1000); })();
this doesn't wait settimeout handler complete before returning. happens timer() called simdur times without delay.
modify code below , should closer require (i've used setinterval, use settimeout it's going more complicated)
var t = 0; var interval = setinterval(function () { if (t >= simdur) { clearinterval(interval); return; } generatedata(); //calculate new data yarr; mylinechart.adddata(yarr, t); //yarr array of y values, t=time mylinechart.update(); //update chart new added data t++; }, 1000) fiddle - http://jsfiddle.net/xhequljw/
Comments
Post a Comment