我正在尝试使用 Javascript 将数组作为变量传递到 HighCharts 图中。带有标记的点显示正确，但没有连接点的样条曲线(数据 2，紫色)。 我也在同一张图表上尝试过，直接传递一个带有值的数组，这次 HighCharts 正在显示标记和样条线(数据 1，红色)。 对于这两个系列，所有线条参数(lineWidth、dashStyle、color)都已设置。 我在 IE11 和 Chrome 和 FireFox 上测试了，结果都是一样的。。。 下面是完整的代码。如果有人已经遇到过这个问题，或者，更好!，知道如何解决这个问题(用标记显示两组数据并用线连接这些标记)，我会非常感兴趣!非常感谢!!
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Chart</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var myData = new Array();
for (n=1;n<=10;n++)
{
myData[n]=Math.floor((Math.random() * 10) + 1);
}
var mySeries = [];
for (var i = 0; i < myData.length; i++){
mySeries.push([i,myData[i]]);
}
$('#container').highcharts({
title: {
text: 'Chart',
x: -20 //center
},
xAxis: {
opposite:true,
title: {text: 'Horizontal Axis'},
showFirstLabel: true,
showLastLabel: true,
min: 0, max: 12,
tickInterval: 1,
startOnTick: true,
endOnTick: true,
},
yAxis: {
title: {text: 'Vertical Axis - inverted'},
reversed: true,
showFirstLabel: true,
showLastLabel: true,
min: 0, max: 12,
tickInterval: 1,
startOnTick: true,
endOnTick: true,
},
tooltip: {
valueSuffix: 'Week'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
series: [
{name:'Data 1',data:[0,1,2,3,4,5,6,7,8,9,10],marker:{symbol:'circle'},lineWidth:1,dashStyle:'Solid',color:'#FF0000'},
{name:'Data 2',data:mySeries ,marker:{symbol:'circle'},lineWidth:1,dashStyle:'Solid',color:'#FF00FF'},
]
});
});
</script>
</head>
<body>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="width: 1000px; height: 700px; margin: 0 auto"></div>
</body>
</html>
最佳答案
我相信 Highcharts 无法绘制样条曲线，因为 mySeries 的第一个值是 undefined。
对于 myData，您从 n = 1 开始，所以 myData[0] 在之后仍然是 undefined你运行你的 for 循环。然后用 i = 0 开始 mySeries，以便将第一个未定义的值添加到 mySeries。相反，如果您开始 i = 1 或将 myData for 循环更改为 i = 0 那么它应该可以工作.
换句话说，这样做:
var myData = new Array();
for (var n=0; n<10; n++){
myData[n]=Math.floor((Math.random() * 10) + 1);
}
var mySeries = [];
for (var i = 0; i < myData.length; i++){
mySeries.push([i,myData[i]]);
}
也就是说，出于效率原因，我会将您的数据生成压缩到一个 for 循环中，这也可以解决问题:
//define an empty array
var mySeries = [];
for (var i = 0; i < 10; i++){
//create your value
var d = Math.floor((Math.random() * 10) + 1);
//push an array into your array
mySeries.push([i,d]);
}
关于javascript - HighCharts 和 Javascript 将数据作为数组传递，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37901671/