highcharts - 手动调用重置缩放

Question

我有一个允许放大/缩小的图表。每次用户放大/缩小时，都会出现“重置缩放”。

现在我添加了一个新的自定义按钮，我需要在其中显示 X 个最新的列数据。我更改了类别和数据，但还需要重置缩放。

这可以做到吗？当用户尝试放大/缩小时，我仍然想保留“重置缩放”。PS：我尝试过这样做。zoomOut() 但随后出现“重置缩放”:(

问候查南

Answer 1

帕维尔的召唤建议

chart.xAxis[0].setExtremes(null,null);

确实有效，顺便说一句，如下所示：http: //jsfiddle.net/tvHg6/

但是，虽然图表缩小了，但 resetZoom 按钮仍然悬在周围，不知道如何隐藏它。调用 chart.resetZoomButton.hide() 会隐藏它，但它会永久隐藏。

Answer 2

正如这里建议的那样

chart.zoom()

但请记住，调用chart.zoom()不会触发chart.events.selection事件。如果您手动或以编程方式单击“重置按钮”，则会触发$('.highcharts-button').click();

Answer 3

如果要重置外部按钮单击的缩放，请执行以下操作：

$("#YourOwnZoomBtnID").click(function(){ 

    $('.highcharts-button').click();
});

如果你想隐藏 highcharts 的内置重置按钮，那么你可以这样做：

xAxis: { categories: xAxisCategories
                ,events: {
      afterSetExtremes: function() {
        $('.highcharts-button').hide();
      }
    }}

jsfiddle 示例在这里：jsfiddle

谢谢卡利安

Answer 4

我刚刚调用了按钮的单击事件，它工作正常。

给定： v_chart 是 Highcharts 图表的变量；

if (typeof v_chart.resetZoomButton !== 'undefined') {
    v_chart.resetZoomButton.element.onclick();
}

Answer 5

1. 隐藏原来的重置按钮

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

2. 照顾事件

 buttons: {
                    resetButton: {
                        symbol: 'url(redo_icon.svg)',
                        _titleKey: "resetZoom",
                        y: 20,
                        x: -20,
                        onclick: function () {
                            this.xAxis[0].setExtremes(null,null);
                            this.yAxis[0].setExtremes(null,null)
                        }
                    }
                }

Answer 6

我们有类似的情况——用户缩放，我们添加了一个“保存这个缩放阶段”按钮，用户点击按钮，我们保存新的最小/最大时间，但现在我们必须让重置缩放按钮消失。

这段代码做到了，如果用户在之后进一步放大，按钮就会返回：

chart.resetZoomButton.hide();
chart.resetZoomButton = chart.resetZoomButton.destroy();