Question

我正在尝试以渐进的方式向图表添加新点。添加新点并设置新的最小值/最大值后，工具提示标签显示不正确。

$(function() {
    Highcharts.setOptions({
        global : {
            useUTC : false
        },
        scrollbar:{
            enabled: true
        },
        lang: {
            rangeSelectorZoom: ' '
        }
    });

    var dataPoints = [[1293820200000, 45], [1293733800000, 25], [1293647400000, 65]]
    var counter = 0;

    var chart = new Highcharts.StockChart({
        chart: {
            renderTo: 'container'
        },
        rangeSelector: {
           enabled: false
        },
        navigator: {
          enabled: false
        },
        scrollbar : {
            enabled : false
        },        
        yAxis: {
            min: 0,
            max: null
        },
        xAxis: {
            type: 'datetime',
            linecolor: '#bbccdd',
            gridLineColor:'#bbccdd',
            tickInterval: 86400000,
            min: 1293820200000,
            max: 1294079400000
        },
        series: [{
            name: 'Count',
            data : [[1293906600000, 56]],
            type : 'column',
        }]
    });

    $('#button').click(function() {
        if(counter == dataPoints.length) {
            return;
        }
        var point = dataPoints[counter++];
        var d = new Date(point[0]);
        var min = d.setDate(d.getDate() - 1);

        chart.xAxis[0].setExtremes(min,null);
        chart.series[0].addPoint(point);
    });
});

知道出了什么问题吗？我错过了什么或使用API不正确吗？

Answer 1

Highstock不会对输入数据进行自动排序，因此必须在给予Highstock时对其进行排序。我认为这是造成问题的原因。

因此，在添加新点时，添加的点必须比上一点更晚。

我已经通过对数据点进行排序来修改您的jsfiddle：

dataPoints.sort(function (a, b) {
    return a[0] - b[0];
});

并将第一点移回时间。（还删除了对setExtremes的调用以保持视图中的所有点，但这与问题无关）。

HighCharts.StockChart数据点悬停时的工具提示标签不正确

1 个答案: