How to disable scroll wheel zoom in ApexCharts?

Question

I've got a line chart in my app using ApexCharts:

import ApexCharts from "apexcharts";

var options = {
  chart: {
    type: "line",
  },
  series: [
    {
      name: "sales",
      data: [30, 40, 35, 50, 49, 60, 70, 91, 125],
    },
  ],
  xaxis: {
    categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999],
  },
};

var chart = new ApexCharts(document.querySelector("#chart"), options);

chart.render();

When I hover the chart and scroll using the mouse wheel, the chart zooms in/out. How do I disable this behavior while still allowing to select areas of the chart to Zoom (just disable the scroll wheel behavior)?

Example

Answer 1

To disable the zoom when using the mouse wheel, you can use the property chart.zoom.allowMouseWheelZoom

For example, the code below disables the zoom for scrolling only (The area can still be zoomed in on by selecting it):

chart = {
  type: "area",
  zoom: {
    enabled: true,
    allowMouseWheelZoom: false
  }
}