CODEWITHSUNDEEP
javascriptjquerychartshighchartsupdates
KaroCodes
KaroCodes

Reputation: 256

Highcharts: update chart when data actualized

I am using Highcharts and I would like this chart to update each second. This is what I have now: JSFiddle

I have timer window.setInterval(updateChart, 1000); and it works properly actualizing data each second.

But I have no idea how to actualize the view. It is important that I don't want to draw chart again and again each second. I only want to shift points and add new ones. Do anyone know how to do that?

Upvotes: 0

Views: 92

Answers (1)

Mark
Mark

Reputation: 108512

Look at the the series.addPoint method.

Your updateChart function becomes:

function updateChart()
{
    for (var source = 1; source <=3; source++)
    {
                var point = [
                23,
                Math.floor((Math.random() * 10*source) + 5+source*2),
                source
            ];
        Highcharts.charts[0].series[0].addPoint(point, false, true); // add the point, don't redraw and shift off a point
    }
    Highcharts.charts[0].redraw(); // 3 points added, now redraw

}

Update fiddle.

Upvotes: 2

Related Questions