Highstock - How to add multiple series with JSON-Array
My goal: I want to draw a HighStock chart with multiple series. The data is loaded by AJAX from data.php. The result of data.php is JSON-Array
My problem: I dont know how to hot grab data from JSON array
Output signal, for example
[[timestamp, value1, value2], [timestamp, value1, value2]]
Series 1 should be -> time stamp and value1
Series 2 should be -> time stamp and value2
This is my code
// Draw the chart
$(function(){
/* The chart is drawn by getting the specific data from "data.php".
* The configuration settings are transmitted by GET-Method. The output is an JSON-Array. */
$.getJSON('data.php',
function(data) {
chart = new Highcharts.StockChart
({
chart: { renderTo: 'chartcontainer', type: 'line' },
title: { text: 'You see the data of the last hour!' },
xAxis: { type: 'datetime', title: { text: 'time' } },
yAxis: { title: { text: 'unit' } },
series: [{ name: 'series1', data: data },{ name: 'series2', data: data }],
});
});
});
I think I need to change
series: [{ name: 'series1', data: data },{ name: 'series2', data: data }],
But I don’t know why
+3
source to share
1 answer
Loop through all the elements of the array data
and populate two separate arrays:
var series1 = [];
var series2 = [];
for (var i = 0; i < data.length; i++) {
series1.push([data[0], data[1]);
series1.push([data[0], data[2]);
}
Then you have timestamp-value pairs in each series array.
Doing this in php can be more efficient, especially if you can replace the current json creation.
+1
source to share