Как сделать zoom div к координате?

Question

[FreeZa]

Добрейшего времени суток, возникла проблема которую я уже пытаюсь решить часа 4, и все никак не могу встать на правильны путь к решению =(

Собственно есть карта (DIV 10000х10000) ее можно перемещать с помощью draggable
все замечательно работает и я начал прикручивать к ней zoom эффект, все зумится как положено, но зумится не красиво, от левого верхнего края окна, а нужно к центру экрана это делать.

Если карту отдалить от объекта находящегося в центре экрана, то объект будет находится в лелом верхнем углу, но если приближать, то он нормально приближает обратно к объекту. собственно не пойму как правильно просчитать этот сдвиг, чтобы карта сдвигалась на нужном этапе зума, на нужное расстояние.

вообще цель сделать зум в координаты на которые я показываю мышкой, но я понять не могу решения данной задачи. как правильно высчитать все значения?

Вот как реализован зум сейчас:

document.querySelector( '.planet_map' ).addEventListener( "mousewheel", function( event ) {

            var zooms = parseFloat($(this).css('zoom'));
        
            if(event.wheelDelta < 0){//отдаляем
                if(zooms > 0.2){
                    //console.log(zooms);
                    $(this).animate({
                        zoom: zooms-0.05,
                        //top: y,
                        //left: x
                    }, 0);
                }

            }else{//приближаем
                if(zooms < 1){
                    //console.log(zooms);
                    $(this).animate({
                        zoom: zooms+0.05,
                        //top: y,
                        //left: x
                    }, 0);
                }
            }
   
    } );