假设我有这个 JSON，从 MySQL 的数组编码:
{"0":{"serie":["2015-07-13","2015-07-20","2015-07-27","2015-08-03","2015-08-10","2015-08-17","2015-08-24","2015-08-31","2015-09-07","2015-09-14","2015-09-21","2015-09-28","2015-10-05","2015-10-12","2015-10-19"]},"data":[{"name":"SHOP NUM 1","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 2","data":"[22377.00,48922.00,24280.00,23007.00,0,17585.00,20860.00,21495.00,17550.00,18320.00,18320.00,32970.00,40265.00,36220.00,0,41755.00,14540.00]"},{"name":"SHOP NUM 3","data":"[0,65.00,0,176.00,0,950.00,170.00,270.00,110.00,20.00,40.00,70.00,50.00,30.00,10.00]"},{"name":"SHOP NUM 4","data":"[2657.00,2489.00,2850.00,4162.00,3033.00,984.00,738.00,1263.00,578.00,941.00,934.00,1205.00,689.00,1075.00,612.00]"},{"name":"SHOP NUM 5","data":"[1422.00,480.00,0,1472.00,910.00,740.00,380.00,640.00,340.00,1490.00,710.00,810.00,3152.00,4230.00,1380.00]"},{"name":"SHOP NUM 6","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 7","data":"[0,3141.00,2807.00,1692.00,3300.00,0,860.00,625.00,0,250.00,0,1450.00,950.00,260.00,2545.00,1520.00,700.00,0]"},{"name":"SHOP NUM 8","data":"[200.00,2116.00,4896.00,6240.00,1236.00,260.00,0,1856.00,604.00,68.00,752.00,3300.00,1816.00,1560.00,30.00]"},{"name":"SHOP NUM 9","data":"[0,0,0,0,0,0,0,300.00,0,700.00,0,0,0,0,0]"},{"name":"SHOP NUM 10","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 11","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 12","data":"[0,0,0,0,0,660.00,860.00,970.00,960.00,990.00,1040.00,1440.00,1120.00,1260.00,550.00]"},{"name":"SHOP NUM 13","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 14","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,100.00,0]"},{"name":"SHOP NUM 15","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 16","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"},{"name":"SHOP NUM 17","data":"[0,0,0,0,0,0,0,0,0,4200.00,2340.00,1560.00,5340.00,420.00,720.00]"},{"name":"SHOP NUM 18","data":"[0,0,0,0,0,0,0,0,0,0,0,2660.00,4300.00,2420.00,1260.00]"},{"name":"SHOP NUM 19","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,840.00]"},{"name":"SHOP NUM 20","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,1675.00,1470.00]"},{"name":"SHOP NUM 21","data":"[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}]}
这是我用来生成图表的 Jquery/Jscript:
$.getJSON(chart_url, function (data) {
categories = data[0]['serie'];
console.log(categories);
//console.log(data['data'].length);
var series = [];
for (i=0;i<data['data'].length;i++) {
series[i] = data['data'][i];
}
chart = new Highcharts.Chart({
chart: {
renderTo: 'chart-ccn',
type: 'line'
},
title: {
text: 'Tutti'
},
xAxis: {
categories: categories
},
yAxis: {
title: {
text: 'Amount'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
this.x +': '+ this.y;
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: series
});
});
这是 console.log(categories) (xAxis):
["2015-07-13", "2015-07-20", "2015-07-27", "2015-08-03", "2015-08-10", "2015-08-17", "2015-08-24", "2015-08-31", "2015-09-07", "2015-09-14", "2015-09-21", "2015-09-28", "2015-10-05", "2015-10-12", "2015-10-19"]
这是 console.log(series) (yAxis):
[Object { name="SHOP NUM 1", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 2", data="[22377.00,48922.00,24280...00,0,41755.00,14540.00]"}, Object { name="SHOP NUM 3", data="[0,65.00,0,176.00,0,950....0.00,50.00,30.00,10.00]"}, Object { name="SHOP NUM 4", data="[2657.00,2489.00,2850.00...,689.00,1075.00,612.00]"}, Object { name="SHOP NUM 5", data="[1422.00,480.00,0,1472.0...152.00,4230.00,1380.00]"}, Object { name="SHOP NUM 6", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 7", data="[0,3141.00,2807.00,1692....45.00,1520.00,700.00,0]"}, Object { name="SHOP NUM 8", data="[200.00,2116.00,4896.00,...,1816.00,1560.00,30.00]"}, Object { name="SHOP NUM 9", data="[0,0,0,0,0,0,0,300.00,0,700.00,0,0,0,0,0]"}, Object { name="SHOP NUM 10", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 11", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 12", data="[0,0,0,0,0,660.00,860.00...1120.00,1260.00,550.00]"}, Object { name="SHOP NUM 13", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 14", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,100.00,0]"}, Object { name="SHOP NUM 15", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 16", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}, Object { name="SHOP NUM 17", data="[0,0,0,0,0,0,0,0,0,4200....,5340.00,420.00,720.00]"}, Object { name="SHOP NUM 18", data="[0,0,0,0,0,0,0,0,0,0,0,2...300.00,2420.00,1260.00]"}, Object { name="SHOP NUM 19", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,840.00]"}, Object { name="SHOP NUM 20", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,1675.00,1470.00]"}, Object { name="SHOP NUM 21", data="[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]"}]
这是最终图表:
你可以看到右边的系列名称是完美的。不适用于 xAxis 类别，也不适用于数据(根本不显示任何数据)。
感谢您的支持!
最佳答案
第一个问题是你的数据不应该包含引号。你的数据应该在 for 循环中串行推送
series.push( data['data'][i]);
而不是
{"name":"SHOP NUM 2","data":"[22377.00,48922.00,24280.00,23007.00,0,17585.00,20860.00,21495.00,17550.00,18320.00,18320.00,32970.00,40265.00,36220.00,0,41755.00,14540.00]"}
应该是这样的
{"name":"SHOP NUM 2","data": [22377.00,48922.00,24280.00,23007.00,0,17585.00,20860.00,21495.00,17550.00,18320.00,18320.00,32970.00,40265.00,36220.00,0,41755.00,14540.00]}
参见 Working fiddle with your code
(我在演示中减少了几个系列)
关于javascript - Highcharts:加载多个系列的问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33285266/