Calling Reset Zoom manually

Question

I have a chart where i allowed zooming in/out. Each time user zoom in/out "Reset Zoom" appears.

Now I have added a new customize button where i need to show X most updated column data. I have changed categories and data, but need also to reset the zoom.

Can this be done ? I still want to keep the "Reset Zoom" when user tries to zoom in/out. PS: I tried doing this.zoomOut() but then the "Reset Zoom" appeared :(

Regards Chanan

Answer 1

Pawel's suggestion of calling

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

does work, btw, as shown here: http://jsfiddle.net/tvHg6/

However, although the chart zooms out, the resetZoom button is still hanging around, not sure how to hide it. Calling chart.resetZoomButton.hide() hides it, but it does so permanently.

Answer 2

As suggested here

chart.zoom()

But keep in mind that calling chart.zoom() does not trigger chart.events.selection event. Which is triggered if you click on "Reset button" manually or programmatically $('.highcharts-button').click();

Answer 3

If you want to reset the zoom on an external button click then do it as follows:

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

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

If you want to hide the Inbuilt Reset Button of highcharts then you can do it as follows:

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

jsfiddle example is here: jsfiddle

Thanks Kalyan

Answer 4

I just called the button's click event and it worked fine.

given: v_chart is variable for Highcharts chart;

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