Question

我是高库存图表的新手，我对此有一些疑问。我有以下highstok图表。

Highcharts.stockChart('chart1', {
    chart: {  
        events: {
            load: function () {             
                var series = this.series[0];                    
                setInterval(function () {                    
                    var x = (new Date()).getTime(), // current time
                        y = Math.round(Math.random() * 100);
                    series.addPoint([x, y], true, true);                        
                }, 1000);
            }
        }
    },    
    rangeSelector: {
        buttons: [{
            count: 1,
            type: 'minute',
            text: '1M'
        }, {
            count: 5,
            type: 'minute',
            text: '5M'
        }, {
            type: 'all',
            text: 'All'
        }],
        inputEnabled: false,
        selected: 0
    },    
    title: {
        text: 'Random'
    },    
    navigator: {
        enabled: true
    },    
    exporting: {
        enabled: false
    },    
    series: [{
        name: 'Random',
        data: [[]]
    }]
});

一切看似正常，但是如果运行https://jsfiddle.net/9pa5gjqw/17/，我们会看到奇怪的行为。根本没有图，我们只能看到添加的点。但是，如果我在“系列”中添加一些数据，一切正常。

应在图表配置中添加什么？可能是我错过了一些东西。

Answer 1

这看起来很奇怪，因为您正在这样做：

series.addPoint([x, y], true, true);

该系列中没有分数。如果我们看一下addPoint()定义，我们将得到第三个参数：

如果为true，则在序列的末尾附加一个点。

因此，由于系列中的起点为0，因此删除点的方式与添加点一样。

3种可能的解决方案，具体取决于您想要的外观。

不要移动序列，只需添加点即可。 Fiddle example
使用x个值初始化序列（我使用10点）Fiddle example
不要先添加x个元素，然后再移位。（我用了10分）Fiddle example

开始时没有数据时的动态Highstock图表

1 个答案: