You must be logged in to post your query.
Home › Forums › Chart Support › StripLines for every 5 minutes
Tagged: striplines
Hello,
I have a dynamic chart that has a “hh:mm” time format on the x-axis. I would like to show a stripline on x-axis for every 5 minutes.
HELP, and thanks!
@blazg,
You can render stripLines on x-axis for every 5 minutes in a dynamic chart with a few extra lines of code as shown in the code snippet below:
function updateChart() { var deltaY ; time.setTime(time.getTime()+60*updateInterval); deltaY = 0.5 + Math.random() *(-0.5-0.5); yValue = Math.round((yValue + deltaY)*100)/100; dataPoints.push({ x: time.getTime(), y: yValue }); if(stripLineCounter%5 == 0) { stripLineArray.push({value:time.getTime(), label: CanvasJS.formatDate(time.getTime(), "hh:mm")}); } stripLineCounter++; if (dataPoints.length > 100 ) { dataPoints.shift(); } chart.render(); setTimeout(updateChart, updateInterval); } updateChart(); }
Please check this JSFiddle for a working example.
— Thangaraj Raman Team CanvasJS
I tried what you did but my problem now is that when value: time.getTime() gets written into the array there is always the same value written in it. Time doesn’t change like it should. I implemented your code from the updateChart function and the two variables: stripLineCounter = 0, var time = new Date() into my code.
This is how the contents of the array look like:
STRIPLINEARRAY: [ {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”}, {“value”:1653983029310,”label”:”5 minute mark”} ]
Nevermind i fixed it. Found out that my time variable wasn’t updating because it was at the wrong place. Thanks for the help.
Glad that you were able to make it work.
You must be logged in to reply to this topic. Login/Register