"zoomed" event not working

[egordanilenko]

"zoomed" event not firing when chart zoomed out or zoomed in

npm requirements: "apexcharts": "^3.49.2", "vue3-apexcharts": "^1.5.3",

Installed Versions:

├── apexcharts@3.49.2 ├── vue3-apexcharts@1.5.3

Vue3 Component:

<script setup lang="ts">
import {ChartDateSeries} from "@/interface/ChartDateSeries";
import waterProbeService from "@/service/WaterProbeService";
import {AxiosResponse} from "axios";
import {WaterProbeInterface} from "@/interface/WaterProbeInterface";

const options:ApexCharts.ApexOptions = {
  tooltip: {
    x: {
      show: true,
      format: 'dd MMM yyyy HH:mm'
    },
    y: {
      formatter: undefined,
      title: {
        formatter: (seriesName: any) => `${seriesName}`
      }
    }
  },
  chart:{
    events:{
      zoomed: function (chart, options){console.log('zoom from opts')}
    }
  },
  xaxis: {
    type: 'datetime',
    labels: {
      datetimeUTC: false
    }
  }
  }
;
const series = ref<ChartDateSeries[]>([]);

function  load(){
  waterProbeService.graph({}).then((response: AxiosResponse)=>{
    const graph:ChartDateSeries = {name: "Pressure", data:[]}
    series.value.push(graph);
    response.data.map((item:WaterProbeInterface)=>{
      const x:Date = new Date(item.dateTime *1000);
      graph.data.push({x: x, y: Math.floor(item.data.pressure * 10)/10})
    })
  });

}
load()

</script>

<template>
  <apexchart height="200px" type="line" :options="options" :series="series"></apexchart>
</template>

<style scoped lang="sass">

</style>