Combine two arrays in chart - Javascript highcharts

Javascript examples for highcharts:Chart Configuration

  1. HOME
  2. Javascript
  3. highcharts
  4. Chart Configuration

Description

Combine two arrays in chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script> 
      <script type="text/javascript">
    $(window).load(function(){/*w ww  . j a va  2  s.c om*/
var data = [
    [1293840000000, 33, 33, 33],
    [1293850000000, 30, 20, 50],
    [1293860000000, 25, 15, 60],
    [1293870000000, 10, 10, 80]
]; // some fake data from server
function convertData(data) {
    var s = [{
        name: 'cpu',
        data: []
    },{
        name: 'nice',
        data: []
    },{
        name: 'test',
        data: []
    }]; //create series array for chart
    // append points
    $.each(data, function(i, vals) {
        s[0].data.push([ vals[0], vals[1] ]);
        s[1].data.push([ vals[0], vals[2] ]);
        s[2].data.push([ vals[0], vals[3] ]);
    })
    return s;
}
$("#container").highcharts({
    xAxis: {
        type: 'datetime'
    },
    tooltip: {
        shared: true
    },
    series: convertData(data)
});
    });

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <div id="container"></div>  
   </body>
</html>

Related Tutorials