Change the zoom Type dynamically? - highcharts

Question

I want to change the zoom-type from "x" to "xy" without creating new instance,
I want do do it like update() method they have..
located in myChart.options.chart.zoomType

Answer 1

You can do something like this:
var chart1 = new Highcharts.StockChart({
chart: {
zoomType: 'xy', //requried!
...
}
...
});
function SwitchToZoomX() {
chart1.pointer.zoomX = true;
chart1.pointer.zoomY = false;
chart1.pointer.zoomHor = true;
chart1.pointer.zoomVert = false;
}
function SwitchToZoomY() {
chart1.pointer.zoomY = true;
chart1.pointer.zoomX = false;
chart1.pointer.zoomVert = true;
chart1.pointer.zoomHor = false;
}

Answer 2

With Highcharts v5 you can now do this:
chart1.update({chart: {zoomType: "y"}})
The update function dynamically updates the chartoptions to imperitively change zoomType post render.

Answer 3

First Prepare a string for the chart to display
Clone Series To Redraw as highcharts set it null after draw.
var seriesClone=[{
name: 'USD to EUR',
data: [1,2,3,4,4,5,6,7,7,8,8,8,9,10,14]
}]
Series Options To SET
var chartOptions={
chart: {
renderTo:'container',
zoomType: 'xy'
},
rangeSelector: {
selected: 1
},
series: [{
name: 'USD to EUR',
data: [1,2,3,4,4,5,6,7,7,8,8,8,9,10,14]
}]
}
var chart = new Highcharts.StockChart(chartOptions);
And When you want to change the value of ZoomType redeclare the chart like this
chartOptions.chart.zoomType='y';
chartOptions.series=seriesClone;
myChart=new Highcharts.StockChart(chartOptions);
Working example JSFIDDLE