Общая информация
----
Делаю свой пример на основе этих демо - примеров.
http://jsfiddle.net/gh/get/library/p...ynamic-update/
http://jsfiddle.net/gh/get/library/p...xis-plotlines/
Объединив, получим это
http://jsfiddle.net/xh3zr7rv/2/
----
Есть график на который каждую секунду добавляется точка (series.addPoint).
На графике также есть 2 прямые параллельные линии (plotLines). Их координаты "Y" нужно обновлять, с каждым новым добавлением точки. Сейчас их координаты неизменны ( value: 20 и 70).
Добавление новой точки происходит в функции setInterval. Сейчас там пример - случайное значение.
Проблема в том, что я не могу выйти за пределы функции setInterval, линии у меня за её пределами.
И внести туда код линий тоже не могу.
Более того, в setInterval я использую $.getJSON, для получения координаты точки.
Это асинхронный запрос и я тем более не могу ничего передать оттуда за его пределы.
Пробовал по аналогии с
chart: {events: {load: function () {
//Аналогично
yAxis: {
title: {text: 'Стоимость в долларах США'},
events: {load: function () {
.....
линии пропадают.
Как динамически обновлять линии в hightcharts?
Код
Highcharts.setOptions({global: {useUTC: false}});
//Создаем график
Highcharts.stockChart('container', {
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.round(Math.random() * 100);
series.addPoint([x, y], true, true); //динамически добавляем точку на график
//У меня же тут $.getJSON('actions.php?get_live_data', function(live_data) {});
}, 1000);
//Конец функции автообновления
}
}
},
yAxis: {
//Вот эти линии
plotLines: [{
value: 20, //Вот значение которое надо обновлять
color: 'green',
dashStyle: 'shortdash',
width: 2,
label: {
text: 'Last quarter minimum'
}
}, {
value: 70, //Вот значение которое надо обновлять
color: 'red',
dashStyle: 'shortdash',
width: 2,
label: {
text: 'Last quarter maximum'
}
}]
},
series: [{
name: 'Random data',
data: (function () {
// generate an array of random data
var data = [],
time = (new Date()).getTime(),
i;
for (i = -999; i <= 0; i += 1) {
data.push([
time + i * 1000,
Math.round(Math.random() * 100)
]);
}
return data;
}())
}]
});
