Question

我有一系列不连续的动态数据要绘制在蜡烛图表上。有没有办法抑制空白蜡烛？

http://jsfiddle.net/nitincool4urchat/3v61f8v7/12/

在上面的小提琴中，连续点击AddPoints按钮的间隔b / w显示空白蜡烛。（不是100％确定这是否是空白蜡烛的原因）

此外，这种情况仅发生在动态数据上，对于已在图表上显示的数据，在不连续的时间间隔内加载工作正常。

此外，无法弄清楚原因，但添加新点会删除现有的蜡烛。时间框架的按钮也不起作用。

$(function () {

    Highcharts.setOptions({
        global : {
            useUTC : true
        }
    });

    $('#container').highcharts('StockChart', {
                        plotOptions: {
                            candlestick: {
                                color: 'red',
                                upColor: 'green'
                            }
                        },
                        rangeSelector: {
                            buttons: [
                                {
                                    count: 1,
                                    type: 'minute',
                                    text: '1M'
                                }
                                ,
                                {
                                    count: 5,
                                    type: 'minute',
                                    text: '5M'
                                },
                                {
                                    type: 'all',
                                    text: 'All'
                                }
                            ],
                            inputEnabled: false,
                            selected: 0
                        },
                        title: {
                            text: 'Live data'
                        },
                        exporting: {
                            enabled: false
                        },
                        series: [
                            {
                                type: 'candlestick',
                                name: 'Trade Data',
                                data:[
                                    [Date.now()-5000,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100],
                                     [Date.now()-3000,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100],
                                     [Date.now()-1000,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100],
                                    [Date.now(),300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100],
                                ]
                            }
                        ]
                    });

    $('#button').click(function () {
        var chart = $('#container').highcharts(),
            i = 0,
            series = chart.series[0];

        for (i; i < 1; i += 1) {
            series.addPoint([Date.now(),300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100,300 + Math.random()*100], true, true);
        }
    });
});

禁用转移工作。虽然无法理解原因！

http://jsfiddle.net/nitincool4urchat/ev64enwh/3/

Answer 1

请在使用前阅读API！

When shift is true, one point is shifted off the start of the series as one is appended to the end. Use this option for live charts monitoring a value over time.

因为shift导致您之前的数据丢失。

零数据的问题是因为datetime格式。因此，如果在图表加载后3秒钟按下按钮，您将获得大约三个零数据，然后显示正常数据。如果在加载数据5秒后按下按钮，则将获得接近5个零数据。但是，如果您在固定的时间间隔内每秒按一下按钮，您将始终获得数据。这又是因为转移属性。我建议使用最后data的x值来添加新数据。替换：

Date.now()

用这个：

chart.series[0].data[3].x + Math.random()*1000

http://jsfiddle.net/ev64enwh/4/

如何避免空白蜡烛在高档烛台图表中显示0,0,0,0的动态更新与班次

1 个答案: