Highstock - How to add multiple series with JSON-Array

Question

My target: I want to draw HighStock-chart with multiple series. Data is loaded by AJAX from data.php. The output of data.php is an JSON-Array

My problem: I don't know hot to grab the data from JSON Array

The output is e.g

[[timestamp,value1,value2],[timestamp,value1,value2]]

Series 1 should be -> timestamp and value1

Series 2 should be -> timestamp 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 have to change

series: [{ name: 'series1', data: data },{ name: 'series2', data: data }],

But I dont know in to what

Hey! I mentioned that in the beginning "The output is e.g [[timestamp,value1,value2],[timestamp,value1,value2]]" — Susanne92
– Susanne92, Commented Feb 1, 2013 at 9:33
Yes I know, but I would like to see your values, because data should be sorted by x, ascending. — Sebastian Bochan
– Sebastian Bochan, Commented Feb 1, 2013 at 9:41
timestamp = time() * 1000 || value1 = e.g. 23 || value2 = e.g. 25 || — Susanne92
– Susanne92, Commented Feb 1, 2013 at 9:49

Yogu · Accepted Answer · 2013-02-01 09:40:29Z

1

Iterate through all items of the data array, 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]);
}

You then have the timestamp-value pairs in each of the series arrays.

Doing this in php might be more efficient, especially if you can replace the current json creation.

answered Feb 1, 2013 at 9:40

Yogu

9,5655 gold badges40 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Susanne92 Over a year ago

Thanks! I have the possibility to change the output of the php-file. Maybe I should create two big arrays ? [[series1data],[series2data]]

Susanne92 Over a year ago

And [series1data] is e.g. [[timestamp,value1],[timestamp,value2]]

Yogu Over a year ago

Yes, the best way would be to create those two arrays in the php files.

Collectives™ on Stack Overflow

Highstock - How to add multiple series with JSON-Array

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related