今天我花了很多时间学习 JavaScript 和 HighCharts。我正在尝试显示此图表。我设法让 JSON 工作，但我更喜欢让 CSV 工作，因为我的所有文件都是 CSV 格式。我已经多次检查了 JavaScript 调试器，发现我的数据保存正确，但数据却无法绘制。轴和标题确实显示。附件是我的代码。预先感谢您的帮助。无论出于何种原因，JSFiddle 无法工作，因此请随意查看我的意思:www.teratuple.com/data/dataVolume.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
</head>
<body>
<div id = "container" style = "width:100%; height:400px;"></div>
<script>
var seriesData = [];
var chart;
$(document).ready(function () {
var options = {
chart: {
renderTo: 'container'
},
rangeSelector: {
buttons: [{
type: 'hour',
count: 1,
text: '1h'
}, {
type: 'day',
count: 1,
text: '1d'
}, {
type: 'month',
count: 1,
text: '1m'
}, {
type: 'year',
count: 1,
text: '1y'
}, {
type: 'all',
text: 'All'
}],
selected: 1 // all
},
xAxis: {
title: {
text: 'Date'
}
},
yAxis: {
title: {
text: 'Volume (mm3)'
}
},
title: {
text: 'Volume Differential'
},
series: [{
data: [],
tooltip: {
pointFormat: '{series.name}: <b>{point.y}</b><br/>',
valueDecimals: 2
}
}]
};
$.get('www.teratuple.com/data/volumeData.csv', function (data) {
var lines = data.split('\n');
$.each(lines, function (lineNo, line) {
var items = line.split(',');
if (lineNo > 0) {
seriesData.push([parseInt(items[0]), parseFloat(items[1])]);
}
});
options.series.data = seriesData;
chart = new Highcharts.StockChart(options);
});
});
</script>
</body>
</html>
最佳答案
series 属性是一个数组，因此可以通过以下方式设置系列数据
options.series[0].data = seriesData;
关于javascript - 从 CSV 文件读取时，Highcharts 不显示数据，而是绘制图表，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26458517/