如何在Highcharts图表中为两个不同的系列获得独立的y轴

时间:2018-05-22 08:51:44

标签: javascript highcharts

我很欣赏任何和所有帮助,因为我对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

0 个答案:

没有答案