Question

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

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

可以这样做吗？当用户尝试放大/缩小时，我仍然希望保持“重置缩放”。 PS：我试过这个.zoomOut（）然后出现了“重置缩放”:(

此致察南

Answer 1

Pawel建议打电话

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

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

但是，虽然图表缩小了，但resetZoom按钮仍然悬空，不知道如何隐藏它。调用chart.resetZoomButton.hide（）会隐藏它，但它会永久保留它。

Answer 2

根据建议here

chart.zoom()

但请记住，调用chart.zoom()不会触发chart.events.selection事件。如果您点击＆＃34;重置按钮＆＃34;手动或以编程方式$('.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

隐藏原始重置按钮

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

手动调用重置缩放

5 个答案: