Highstock Navigator和xAxis显示数字而不是日期

时间:2018-08-22 06:56:19

标签: javascript highcharts

从本地csv文件加载的数据。网页在本地节点“连接”和“ serveStatic”网络服务器上运行。

导航器和xAxis显示的是数字而不是存储在csv文件中的日期,因此rangeselector和zoom无效。

代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script src="https://code.highcharts.com/stock/highstock.js"></script>
    <script src="https://code.highcharts.com/stock/modules/data.js"></script>
    <script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
    <script src="https://code.highcharts.com/stock/modules/export-data.js"></script>
</head>
<body>
    <div id="container" style="width:80%; height:600px;"></div>  
</body>
<script>
    $(function () { 
    var myChart = Highcharts.stockChart('container', {
        title: {
            text: 'Consumption'
        },
        xAxis: {
            type: 'datetime',
            title: {
                text: 'Date'
            }
        },
        yAxis: {
            title: {
                text: 'Kilogram'
            }
        },
        navigator: {
            xAxis: {
                isInternal: true
        },
            yAxis: {
                isInternal: true
        }
        },
        data: {
            csvURL: window.location.origin + '/trend.csv'
        }
    });
});
</script>
</html>

'isInternal'参数设置为解决this问题。

当我在菜单中选择“查看数据表”时,将显示以下内容:

Date    Value
09-06-2018 18:00:15 1296.26098632813
09-06-2018 18:28:09 1451.98901367188
2   563.752014160156
3   429.237213134766
4   445.504516601563
5   1216.92199707031
...

日期有些奇怪。看起来只有前两行得到了正确处理。

任何人都可以看一下,也许会指出正确的方向吗?

csv文件中的示例

DateTime;Value
09/06/2018 18:00:15;1296.26098632813
09/06/2018 18:28:09;1451.98901367188
09/06/2018 18:56:03;563.752014160156
09/06/2018 19:23:57;429.237213134766

0 个答案:

没有答案