Retrieving JSON data for Highcharts with multiple series?

12,056

As per Pal's comment - changed it to this:

val1.push([value[0], value[1]]);
val2.push([value[0], value[2]]);
Share:
12,056
Greg
Author by

Greg

Updated on June 04, 2022

Comments

  • Greg
    Greg almost 2 years

    I've been looking through tons of examples but I can't seem to get my code to pull out the data. The chart is blank.

    I have a php file that gives the following: (date, value1, value2)

    [
    ["2013-09-15 08:44:37",19.8,8.19],
    ["2013-09-15 08:47:37",18.4,7.81],
    ["2013-09-15 08:50:37",18.3,7.78],
    ["2013-09-15 08:53:37",18.1,7.77]
    ]
    

    I then have the following code:

    <!DOCTYPE html>
    <head>
      <script src="js/jquery-1.10.2.min.js"></script>
      <script src="js/highcharts.js" type="text/javascript"></script>
      <script>
      var chart;
      $(document).ready(function() {
         var options = {
            chart: {
               renderTo: 'container',
               type: 'line',
            },
            title: {
            },
            xAxis: {
               type: 'datetime'
            },
            yAxis: {
            },
            series: [{
               name: 'val1',
               data: []
           }, {
               name: 'val2',
               data: []
            }]
         };
         $.getJSON('data_day.php', function(json) {
            val1 = [];
            val2 = [];
            $.each(json, function(key,value) {
            val1.push([value.time, value.val1]);
            val2.push([value.time, value.val2]);
            });
    
            options.series[0].data = val1;
            options.series[1].data = val2;
            chart = new Highcharts.Chart(options);
         });
      });
      </script>
    </head>
    <html>
    

    I'm trying to use firebug to see where I've gone wrong. If I put

    console.log(key,value) 
    

    under the $.each I can see the data:

    0 ["2013-09-15 08:50:37", 18.3, 7.78]
    1 ["2013-09-15 08:53:37", 18.1, 7.77]
    2 ["2013-09-15 08:56:37", 18.2, 7.8]
    

    Is there a problem with the

    val1.push([value.time, value.val1]);
    

    or

    options.series[0].data = val1;
    

    Update: Changed it to this and its now working.

    val1.push([value[0], value[1]]);
    val2.push([value[0], value[2]]);