hotel-ai-widget/embed/utils/mapUtils.js

A customizable hotel chat widget for React and vanilla HTML

export function easeInOutCubic(t) {
    return t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
}
export function flyTo(map, target, options = {}) {
    const { steps = 100, zoom = 13 } = options;
    const center = map.getCenter();
    if (!center)
        return;
    const startLat = center.lat();
    const startLng = center.lng();
    const targetLat = target.lat;
    const targetLng = target.lng;
    const startZoom = map.getZoom() ?? 5;
    const zoomDiff = zoom - startZoom;
    let step = 0;
    function animate() {
        step++;
        const progress = easeInOutCubic(step / steps);
        const lat = startLat + (targetLat - startLat) * progress;
        const lng = startLng + (targetLng - startLng) * progress;
        const currZoom = startZoom + zoomDiff * progress;
        map.setCenter({ lat, lng });
        map.setZoom(currZoom);
        if (step < steps)
            requestAnimationFrame(animate);
        else {
            map.setCenter(target);
            map.setZoom(zoom);
        }
    }
    animate();
}