Как динамически обновлять линии в hightcharts?
Общая информация
---- Делаю свой пример на основе этих демо - примеров. 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; }()) }] }); |
unity555,
так нужно? http://jsfiddle.net/_Marina_/xh3zr7rv/20/ наверное как-то проще можно, нужно читать документацию. |
Цитата:
Я думал, что будет сложнее и понадобятся очень хорошие знания JS. Но тут, как я понял, нужны знания компонента highcharts? В их general и api такого не находил. |
unity555,
я не читала их документацию, смотрела через консоль. var my_chart = Highcharts.stockChart('container', { ... console.log(my_chart); и ищите там, откуда ваши plotLines выросли) |
Часовой пояс GMT +3, время: 03:18. |