我的 json 数据如下所示:
[
[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 ]
]
第一行是纪元时间的日期,第二行是 CPU 利用率,第三行是内存利用率。我想创建时间序列图表,日期在 xaxis 上,CPU 和内存数据在 yaxis 上用不同的线。鉴于 json 外部文件提供的数据,我将如何完成此操作。我看到了 javascript 中的示例,但这确实不现实。非常感谢任何帮助。
我尝试了以下我想拆分cpu和内存的地方。我没有得到任何结果,空白页面。这是解决这个问题的方法还是有其他方法可以在一个图表中绘制多个变量?我的 javascript 看起来像这样:
<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>
图表看起来不正确。看起来 xaxis 和 yaxix 都在报告日期值。有没有办法设置y轴值?