Question

我对Highcharts缩放选项有一点问题。

我想重置缩放以保留我设置的最大值和最小值。用户可以放大，但当他缩小时（使用重置缩放按钮），我希望图表符合我之前设置的最大值和最小值。

现在，highcharts抓住dataMin和dataMax values来重置缩放。

我试图覆盖setExtreme事件中的这些值但没有成功。

以下是显示此行为的代码段：

$(function () {
  $('#container').highcharts({
    chart: {
        zoomType: 'x',
    },
    xAxis: { type:'datetime' },
    series: [{
        data: [
            [Date.UTC(1970, 10, 9), 0.25],
            [Date.UTC(1970, 10, 27), 0.2],
            [Date.UTC(1970, 11, 2), 0.28],
            [Date.UTC(1970, 11, 26), 0.28],
            [Date.UTC(1970, 11, 29), 0.47],
            [Date.UTC(1971, 0, 11), 0.79],
            [Date.UTC(1971, 0, 26), 0.72],
            [Date.UTC(1971, 1, 3), 1.02],
            [Date.UTC(1971, 1, 11), 1.12],
            [Date.UTC(1971, 1, 25), 1.2],
            [Date.UTC(1971, 2, 11), 1.18],
            [Date.UTC(1971, 3, 11), 1.19],
            [Date.UTC(1971, 4, 1), 1.85],
            [Date.UTC(1971, 4, 5), 2.22],
            [Date.UTC(1971, 4, 19), 1.15],

        ]
    }]
  });
  var chart = $('#container').highcharts();
  chart.xAxis[0].setExtremes(Date.UTC(1970, 5, 9), Date.UTC(1971, 10, 9));
});

http://jsfiddle.net/Ln7x4mba/1/

解

基于@jlbriggs的答案，因为我动态更新了相同的图表，解决方案是：

 chart.xAxis[0].update({min: myMinValue, max: myMacValue});

http://jsfiddle.net/Ln7x4mba/4/

Answer 1

如果将min和max设置为x轴配置选项的一部分，而不是在构建图表后调用setExtremes（）函数，则重置缩放按预期工作（并且效率更高）：< / p>

xAxis: { 
  type:'datetime',
  min: Date.UTC(1970, 5, 9),
  max: Date.UTC(1971, 10, 9)
}

更新了小提琴：

http://jsfiddle.net/Ln7x4mba/3/

Answer 2

隐藏图表中显示的按钮

chart: {
  resetZoomButton: {
    theme: {
      display: 'none'
    }
  }
}

然后使用您自己的按钮：

$('#button2').click(function(){
  chart.xAxis[0].setExtremes(Date.UTC(1970, 5, 9), Date.UTC(1971, 10, 9));
});

Updated Fiddle

HighCharts - 在缩放重置中设置最大值和最小值

2 个答案: