高图表 - 在缩放重置中设置最大值和最小值

HighCharts - Set Max and Min values in zoom reset

本文关键字：设置 最大值 最小值 缩放 高图表      更新时间：2023-09-26

我对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/

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

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

更新的小提琴：

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

隐藏图表内显示的按钮

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

然后使用您自己的按钮：

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

更新的小提琴

相关文章：