如何在高图中设置yaxis值

Question

my json data looks like this:

[
 [1362027751000, 1362027781000, 1362027811000, 1362027841000, 1362027871000, 1362027901000, 1362027931000, 1362027961000, 1362027991000, 1362028021000 ],
[ 66, 72, 69, 72, 69, 68, 71, 73, 63, 57 ],
[ 50, 5, 67, 72, 34, 100, 10, 100, 23, 56 ] 

]

the first row is date in epoch time, the second is cpu utilization and the third is the memory utilization. I would like to create time series chart, date being on xaxis and CPU and mmeory data on yaxis with different lines. How would I accomplish this given the data provided with the json external file. I see examples where that the in the javascript but this is really not realistics. Any help is greatly appriciated.

I attempted to the following where I wanted to split cpu and memory. I am not getting any results back, empty page. Is this the way to address this or there are other ways to draw multiple variables in one chart? my javascript looks like this:

<script type="text/javascript">

        $(document).ready(function() {
                var options = {
                    chart: {
                        renderTo: 'container',
                        type: 'area'
                    },
                    xAxis: {
                        type: 'datetime'

                    },
                //series: [{}]
                series: [{{
                type: 'spline',
                name: 'CPU',
                data: cpu
            }, {
                type: 'spline',
                name: 'memory',
                data: memory
            }}]

                };

            $.getJSON('data.json', function(data) {
                options.series[0].data = data;
                var cpu = [];
                var memory=[];

                for(i=0; i< data.length, i++) {
                    for(j=0; j<data[i].length; j++){
                    alert(data[i].length);
                        cpu.push([
                            data[i][j], // the date
                            data[1][j] // the cpu

                        ]);
                        memory.push([
                            data[i][j], // the date
                            data[2][j] // the volume
                        ])
                    }
                }

                var chart = new Highcharts.Chart(options);
                //alert(JSON.stringify(data, null, 4));



            });

        });
     </script>  

the charts does not look right. It looks like xaxis and yaxix are both reporting the date value. Is there a way to set the yaxis values?

Answer 1

My preference is to send in the data for a series as [x,y] pairs. So your data would look like:

[
[1362027751000, 66], [1362027781000, 72], [1362027811000, 69], [1362027841000, 72], [1362027871000, 69], [1362027901000, 68], [1362027931000, 71], [1362027961000, 73], [1362027991000, 63], [1362028021000, 57 ]
]

and:

[
[1362027751000, 50], [1362027781000, 5], [1362027811000, 67], [1362027841000, 72], [1362027871000, 34], [1362027901000, 100], [1362027931000, 10], [1362027961000, 100], [1362027991000, 23], [1362028021000, 23]
]

You would need to send this in as 2 different series.data blocks.

Answer 2

   for(i=0; i< data.length-2; i++) {
          for(j=0; j<data[i].length; j++){

               cpu.push([
    data[i][j], // the date
    data[1][j] // the cpu

     ]);
     memory.push([
    data[i][j], // the date
    data[2][j] // the volume
     ])
}
  }