highstock - 导航器时间范围在添加/删除系列后不会更新

时间:2013-09-02 05:40:49

标签: time highstock series navigator

我使用highstock绘制具有不同时间范围的系列,但导航器的时间范围在添加/删除系列后没有正确更新。代码在http://jsfiddle.net/QssUu/1/

中共享
$(function() {

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data2) {
    // Create the chart
    window.chart = new Highcharts.StockChart({
        chart : {
            renderTo : 'container'
        },

        rangeSelector : {
            selected : 5
        },

        title : {
            text : 'AAPL Stock Price'
        },

        series : [{
            name : 'AAPL',
            data : data2,
            tooltip: {
                valueDecimals: 2
            }
        }]
    },function(chart){


        var newSeries = {
            name : 'new',
            data : [[1010112000000,55],[1136246400000,60.10],[1138752000000,65.03],[1204502400000,70.41],[1257120000000,75.47],[1349049600000,80.59]]
        };

        $('#btn1').click(function(){
            chart.addSeries(newSeries); //add new serie
        });

        $('#btn2').click(function(){
            chart.series[0].remove(); //remove serie from chart
        });            
    });
});

以下是我所做的步骤列表:

  1. 在图表中创建一个系列1,图表rangeSelector设置为“all”。
  2. 点击“添加系列2”以在图表中创建系列2。我希望看到导航器时间范围能够更新,以涵盖系列1和2(从2001年12月31日开始)。但它仍然只包括系列1。
  3. 点击“删除系列1”可从图表中删除系列1。我希望看到导航器更新为仅包含系列2的时间范围,但它仍然包括系列1的时间范围。
  4. 有人可以告诉我如何在添加/删除系列后更新导航器的时间范围?如果rangeSelector的“from”和“to”也可以相应地更新,那将是很好的。请注意,在我的应用程序中,我将使用2个以上的系列,并随时添加/删除任何系列。所以该解决方案应该适用于超过2个系列。

    提前致谢!

    亚历

2 个答案:

答案 0 :(得分:2)

点击addSeries后,您可以使用setExtremes()并设置自定义范围。

答案 1 :(得分:2)

这是一个jsfiddle http://jsfiddle.net/A8kY9/

所以将id添加到导航器

navigator: {
    enabled: true,
    series: {
            id: 'navigator'
    }
},

            var nav = chart.get('navigator');
            nav.setData(newSeries.data);
            chart.xAxis[0].setExtremes();

希望更清楚 帕特里克