手动调用Reset Zoom

Question

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

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

这能做到吗?当用户尝试放大/缩小时，我仍然想保留"重置缩放"。PS:我试着这样做。zoomout()，但随后出现了"重置缩放":(

的问候Chanan

Answer 1

Pawel打电话的建议

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();
});

如果你想隐藏高图的内置重置按钮，你可以这样做:

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

jsfiddle的例子如下:

谢谢Kalyan

Answer 4

我刚刚调用了按钮的click事件，它工作得很好。

给定:v_chart是Highcharts的变量;

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

Answer 5

1. 隐藏原来的重置按钮

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

处理事件

 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();