Disabling mouse wheel zoom in maps

While mouse wheel zooming on maps is a handy intuitive interaction, it may in some cases be frustrating when it interferes with the scrolling of the web page. This tutorial will show how to disable mouse wheel zooming on the Map chart.

The interaction events on Map chart are mostly set on the chart's chartContainer.

To disable mouse wheel on it, simply set wheelable = false on it:

chart.chartContainer.wheelable = false;

chart.chartContainer.wheelable = false;

{
  // ...
  "chartContainer": {
    "wheelable": false
  }
}

Scroll the demo below, to see if it interferes with your scrolling when you hover on the map:

See the Pen amCharts 4: disabling wheel zoom by amCharts (@amcharts) on CodePen.24419