call a function on zoom

[ANGEEEL7U7]

I'm sorry for my English,

I am looking for a way to call a function when I want to zoom to do this
https://user-images.githubusercontent.com/82860569/197346637-cbd61144-9283-45b6-8ef0-9ec37b8741b4.mp4

this is how far i have progressed
`

let f = new Date();

let fecha_un_mes_anterior_comparativa = String(f.getFullYear() + '-' + (f.getMonth() + 1) + '-' + '02')

let fecha_datecpiker = date.getFullYear() + '/' + String(date.getMonth() + 1).padStart(2, '0') + '/' + String(date.getDate()).padStart(2, '0');

var options_comparacion_barras = {

    series: [{
            name: 'Egresos',
            data: $datos_egresos,
        },
        {
            name: 'Ingreso',
            data: $datos_ingresos
        }
    ],

    chart: {
        type: 'bar',
        height: 300,
        animations: {
            enabled: false,
        },

        toolbar: {

            tools: {
                selection: false,
                zoom: true,
                zoomin: true,
                zoomout: true,
                pan: false,
                reset: false
            }
        }
    },
    plotOptions: {
        bar: {
            horizontal: false,
            columnWidth: '50%',
            endingShape: 'rounded'
        }
    },
    dataLabels: {
        enabled: false
    },
    stroke: {
        show: false,
        width: 0,

    },
    colors: color,
    fill: {

        opacity: 0.5
    },
    xaxis: {
        type: 'datetime',

        labels: {
            format: 'dd MMM'
        }
    },
    tooltip: {

        enabledOnSeries: undefined,
        custom: function({
            series,
            seriesIndex,
            dataPointIndex,
            w
        }) {
            data = w.globals.initialSeries[seriesIndex].data[dataPointIndex];

            const options = {
                year: 'numeric',
                month: 'short',
                day: 'numeric'
            };
            var $style = 'style="display:none;"'
            if (w.globals.initialSeries[seriesIndex].data[dataPointIndex].tasa) {
                $style = ''

            } else {
                $style

            }

            var $funcion = `
            <div class="card">
                <div class="card-header">
                    <span class="card-title" style="font-size: 12px!important;">${new Date(w.globals.seriesX[seriesIndex][dataPointIndex]).toLocaleDateString(undefined,options)}</span>
                </div>
                <div class="card-body bg-body">
                  
                        <div class="row" >
                            <div class="col" ${$style}><small>Original: </small><span class="badge badge-soft-warning">${data.original}<span></div>
                        </div>
                        <div class="row mt-1">
                            <div class="col" ${$style}><small>Tasa: </small><span class="badge badge-soft-secondary">${data.tasa}<span></div>
                        </div>
                        <div class="row mt-1">
                            <div class="col"><small>Convertido: </small><span class="badge badge-soft-primary">${data.y}<span></div>
                        </div>
                </div>
            </div>`;
            return $funcion
        }
    }
};`