我很欣赏任何和所有帮助,因为我对JS很新。我试图制作一个包含2条线的图表,这些线具有独立的y轴范围,因此一条线看起来不那么平坦。数据来自CSV。图表位于:http://achouman-com.stackstaging.com/tester2-highcharts.html
这是我的代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Stock Data - Highcharts</title>
<!-- 1. Add these JavaScript inclusions in the head of your page -->
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="/Highstock-6.1.0/code/js/highcharts.js"></script>
<script src="/Highstock-6.1.0/code/js/modules/stock.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/boost.js"></script>
<!-- 2. Add the JavaScript to initialize the chart on DOM loaded -->
<script>
document.addEventListener('DOMContentLoaded', function () {
Highcharts.chart('container', {
chart: {
type: 'line'
},
data: {
csvURL: 'http://achouman-com.stackstaging.com/example.csv'
},
rangeSelector: {
selected: 1
},
title: {
text: 'Stock Price'
},
yAxis: {
max: 800,
title: {
text: 'Price (Dollars)'
}
}
});
});
</script>
</head>
<body>
<!-- 3. Add the container -->
<div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
</body>
</html>
CSV看起来像这样。它的示例数据。实际数据是数百万行,因此我无法对代码中的数据进行硬编码。
Index (xaxis),Dollars,Algorithm out
1,3,300
2,4.3,257
3,2.1,357
4,4.8,368
5,3.4,469
6,2.3,464
7,3.2,358
8,2.5,357
9,2.4,678
10,2.8,457
11,3.7,468
12,3.6,236
13,3.5,347