Highslide JS> Highchart - как мне изменить?

Question

Как мне сделать этот пример http://www.highcharts.com/demo/?example=spline-plot-bands&theme=default, живым, обновляя каждую секунду, как в этом примере http://www.highcharts.com/demo/?example=dynamic-update&theme=default.

Этот первый пример, сплайн с полосами сюжета, это именно то, что япосле;2 графических графика с возможностью скрыть или показать один или другой. Единственное, чего не хватает, так это сделать их живыми и обновлять каждую секунду, как в другом примере.

Как я могу этого достичь?

Спасибо!

Answer 1

Обновление в реальном времени во втором выполняется добавлением таймера к событию load внутри chart

chart: {
    //...
    events: {
        load: function() {
            // set up the updating of the chart each second
            var series = this.series[0];
            setInterval(function() {
                var x = (new Date()).getTime(), // current time
                    y = Math.random();
                series.addPoint([x, y], true, true);
            }, 1000);
        }
    }
    //...
}

Итак, когда диаграмма закончила загрузку, вызывается setInterval, и это вызывает предоставленную функцию каждые 1000 миллисекунд (т.е. каждую секунду); обратный вызов для setInterval просто добавляет новую точку через series.addPoint.

Все, что вам нужно сделать, это добавить обработчик события load, который устанавливает соответствующий вызов setInterval для добавления ваших новых точек. В более реалистичном случае вы бы использовали setTimeout для запуска вызова AJAX, чтобы получить больше данных, а затем при успешном обратном вызове AJAX вы добавили бы новые точки и снова позвоните setTimeout, чтобы организовать чтобы другой AJAX-вызов выполнялся через одну секунду (или любой другой промежуток времени, который работает в вашем приложении).

Документация Highcharts выглядит достаточно всеобъемлющей, и в каждом примере (из которых их много) имеется удобная кнопка «Параметры просмотра» для просмотра кода, поэтому настройка параметров должна быть довольно простой, с небольшим количеством исследование.