[Solved] Google Maps Api – when is map.panto(latlng) smooth

by


Ok I think the answer to the specific question is just down to rounding but I don’t need to chase that one as, in the last month or so, Google has decouple its rehoming of the markers from the smooth pan test. It is now an arbitrary 100000px limit before it stops maintaing the DOM for markers.

The complete story can be found here (remember due to the API key hard-coding you need to copy testmap.html to your local file system before trying to run it.)

The TL;DR version and core logic is in this function: –

    function makeDestCenter(){
        console.log("Panning to new Center " + map.getZoom());
        var home = map.getCenter();
        var zoom = map.getZoom();
        var scale = 1 << zoom;  
        var proj = map.getProjection();
        
        var homePoint =  proj.fromLatLngToPoint(home);  
        var startPixelX = Math.round(homePoint.x * scale);
        var startPixelY = Math.round(homePoint.y * scale);

        var destPoint =  proj.fromLatLngToPoint(dest[destIndex]);
        var destPixelX = Math.round(destPoint.x * scale);
        var destPixelY = Math.round(destPoint.y * scale);
        var xTrip = Math.abs(destPixelX - startPixelX);
        var yTrip = Math.abs(destPixelY - startPixelY);

        console.log("sX " + startPixelX + " dX " + destPixelX + " sY " + startPixelY + " dY " + destPixelY);

        if ((xTrip > MAX_TRIP) || (yTrip > MAX_TRIP)) {
            google.maps.event.addListenerOnce(map, 'idle', makeDestCenter);
            map.setZoom(--zoom);
        } else {
            if (xTrip == TOO_SMALL && yTrip == TOO_SMALL) {
                google.maps.event.addListenerOnce(map, 'idle', makeDestCenter);
                map.setZoom(++zoom);
            } else {
                map.panTo(dest[destIndex]);
            }
        }
    }

solved Google Maps Api – when is map.panto(latlng) smooth