javascript - 如何每分钟更新一次highchart

问题描述

我的数据来自获取实时数据的 MYSQL 数据库。我没有使用 json 或 php。我希望它从上午 9 点到下午 5 点开始每分钟更新一次。我尝试过 setInterval 和 setTimeout 和 chart.redraw() 等方法，但似乎无法使其工作。我也试过 highcharts 链接中的动态更新图表在这里 https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/stock/demo/dynamic-update但似乎不能将随机数据语法转换为我的数据库数据。我的代码是：


<head>
    <script src="https://code.highcharts.com/stock/highstock.js"></script>
    <script src="https://code.highcharts.com/modules/exporting.js"></script>
    <script src="https://code.highcharts.com/modules/export-data.js"></script>
    <script src="https://code.highcharts.com/modules/accessibility.js"></script>
    <script src="https://code.highcharts.com/stock/modules/drag-panes.js"></script>
    <link rel="stylesheet" type="text/css" href="/public/oi chart.css">

</head>
<figure class="highcharts-figure">
    <div id="container"></div>
</figure>

<script type="text/javascript">
  
    Highcharts.stockChart('container', {
        chart: {
            height: (1 / 2 * 100) + '%' // 1:2 ratio
        },
        rangeSelector: {
            enabled: true,
            selected: customRange,
            buttons: [{
                type: 'day',
                count: 1,
                text: '1D'
            }, {
                type: 'week',
                count: 1,
                text: '1W'
            }, {
                type: 'week',
                count: 2,
                text: '2W'
            }, {
                type: 'month',
                count: 1,
                text: '1M'
            }, {
                type: 'all',
                text: 'All'
            }]
        },
        time: {
            timezoneOffset: timezone
        },
        title: {
            text: chartTitle,

        },
        subtitle: {
            text: subTitle,
        },
        yAxis: {
            offset: 60,
            title: {
                text: 'Open Interest'
            },
            resize: {
                enabled: true
            }
        },
        xAxis: {
            type: 'datetime'
        },

        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle'
        },

        plotOptions: {
            series: {


                marker: {
                    enabled: false
                },
                label: {
                    connectorAllowed: false
                },

            }
        },

        series: [{
            name: 'Expected',
            data: [<% for(var i=0; i < expected_data.length; i++) { %> [<%= expected_data[i] %>], <% } %>].sort()

        }, {
            name: 'Actual',
            data: [<% for(var i=0; i < actual_data.length; i++) { %> [<%= actual_data[i] %>], <% } %>].sort()

        }],


        responsive: {
            rules: [{
                condition: {
                    maxWidth: 500
                },
                chartOptions: {
                    legend: {
                        layout: 'horizontal',
                        align: 'center',
                        verticalAlign: 'bottom'
                    }
                }
            }]
        }

    });
</script>

</html>```

标签： javascriptnode.jshighchartsejs

javascript - 如何每分钟更新一次highchart

问题描述

解决方案

推荐阅读