【问题标题】:highstock -- navigator time range does not update after adding/removing serieshighstock -- 添加/删除系列后导航器时间范围不更新
【发布时间】:2013-09-05 03:43:29
【问题描述】:

我使用 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 的时间范围。

谁能告诉我如何在添加/删除系列后更新导航器的时间范围?如果 rangeSelector 的“from”和“to”也可以相应地更新,那就太好了。请注意,在我的应用程序中,我将使用超过 2 个系列并随时添加/删除任何系列。因此,该解决方案应该适用于 2 个以上的系列。

提前致谢!

亚历克斯

【问题讨论】:

    标签: time highstock series navigator


    【解决方案1】:

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

    【讨论】:

    • 您能否提供一个使用我提供的 jsfiddle 示例的工作示例?
    【解决方案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();
    

    希望更清楚 帕特里克

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-12-04
      • 2014-01-26
      • 1970-01-01
      • 2016-01-04
      • 2012-03-08
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多