1

我想使用 Highcharts 图表并动态更新 y 轴。实际上我想每 5 秒更新一次nsw、Tas、ACT 。我该怎么做 ？

这是我的代码。

$(function () {
$('#container').highcharts({
                    title: {
                        text: 'Histogram',
                        x: -20 // center
                    },
                    subtitle: {
                        text: 'Source: www.trove.com',
                        x: -20
                    },
                    xAxis: {
                        categories: ['NSW', 'Tas', 'ACT','QLD','VIC','SA','WA']
                    },
                    yAxis: {
                        title: {
                            text: 'Hits'
                        },
                        plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }]
                    },
                    tooltip: {
                        valueSuffix: '°C'
                    },
                    legend: {
                        layout: 'vertical',
                        align: 'right',
                        verticalAlign: 'middle',
                        borderWidth: 0
                    },
                    series: [{
                        name: 'States',
                        data: [nsw, Tas, ACT,qld,vic,sa,wa]
                    }]
                });
            });

            });
4

3 回答 3

1

在文档中，您可以在 jsfiddle 中找到来自 Highcharts 的示例。看看http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/dynamic-update/。在示例中，每秒都会添加一个新点。下面是相关的代码部分：

chart: {
    type: 'spline',
    animation: Highcharts.svg, // don't animate in old IE
    marginRight: 10,
    events: {
        load: function () {

            // set up the updating of the chart each second
            var series = this.series[0];
            setInterval(function () {
                var x = (new Date()).getTime(), // current time
                    y = Math.random();
                series.addPoint([x, y], true, true);
            }, 1000);
        }
    }
},
`
于 2013-08-30T07:26:36.607 回答
0

最简单的方法是使用 javascript 函数“setInterval()”来调用它。

这是一个链接，您可以在其中找到一种方法：

http://www.w3schools.com/js/js_timing.asp

如果你不是很擅长 javascript，你可能需要这个函数声明：var functionName = function() {} vs function functionName() {}

于 2013-08-30T06:55:51.690 回答
0

利用：

events: {
    load: function () {

        // set up the updating of the chart each second
        var series = this.series[0];
        setInterval(function () {
            var x = (new Date()).getTime(), // current time
                y = Math.random(),
                l = series.data.length;

            for(var i  = 0; i < l; i++) {
                series.data[i].update({ 
                  y: getHits(i) // or something else
                });
            }
        }, 5000); // 5 seconds
    }
}

index数据数组中 nsw/Tas/ACT 的索引（从 0 开始计数）在哪里。（对于 nsw = 0，对于 Tas = 1 等）

于 2013-08-30T09:38:01.613 回答