Limit map panning from moving beyond the poles

[Jeremy]

I'm trying to figure out how to make my map unable to pan beyond the north or south poles. I don't know if there is an existing script, but I couldn't find anything and tried my hand at something. Unfortunately its flawed because it doesn't seem like there is a 90 or -90 latitude in the maps API (it just seems the values reported back get excedingly close to 90 but never reach it or pass beyond it) and that it causes stack size errors.

Anyone know of a simpler method that actually works?

google.maps.event.addListener(map, "center_changed", mapDragged);

function mapDragged(){

var bounds = map.getBounds();

if(bounds.getSouthWest().lat() < -90){

map.fitBounds(new google.maps.LatLngBounds(new google.maps.LatLng(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()), new google.maps.LatLng(-90, bounds.getNorthEast().lng())));

}

}

[Ben Appleton]

That's right: the default map types use the Mercator projection, in which the poles are rendered infinitely far up/down the map. So as you pan up/down you approach the poles but cannot reach them.

Have you tried limiting latitude to 85 instead?

Android brevity

> --
> You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
> To view this discussion on the web visit https://groups.google.com/d/msg/google-maps-js-api-v3/-/9v7aVnhbp2YJ.
> To post to this group, send email to google-map...@googlegroups.com.
> To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.
>

[Jeremy]

Thank you for the reply.

I've now been playing with numbers less than 90 and more than -90.

Using a centerpoint it stops the map, but isn't very ideal because it's not very accurate:

google.maps.event.addListener(map, "center_changed", mapDragged);

function mapDragged(){

if(map.getCenter().lat() > 85) map.setCenter(new google.maps.LatLng(85, map.getCenter().lng()));

else if(map.getCenter().lat() < -85) map.setCenter(new google.maps.LatLng(-85, map.getCenter().lng()));}

Using bounds seems to be more appropriate, but I keep getting "max call stack size exceeded" errors:

google.maps.event.addListener(map, "center_changed", mapDragged);

function mapDragged(){

var bounds = map.getBounds();

if(bounds.getNorthEast().lat() > 85) map.fitBounds(new google.maps.LatLngBounds(new google.maps.LatLng(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()), new google.maps.LatLng(85, bounds.getNorthEast().lng())));

else if(bounds.getSouthWest().lat() < -85) map.fitBounds(new google.maps.LatLngBounds(new google.maps.LatLng(-85, bounds.getSouthWest().lng()), new google.maps.LatLng(bounds.getNorthEast().lat(), bounds.getNorthEast().lng())));}

I'm thinking I'm getting these errors because setting a fitBounds command makes sure that box is shown, so it may still show some of the "forbidden range", thus firing off the function again, and again, and again.

Is there a more appropriate command I'd be able to use, or some way of returning false to the pan?

[Ben Appleton]

The stack overflow is because .fitBounds() changes the center, which calls your listener, which calls .fitBounds() again. You could work around this by checking the time since you last called .fitBounds().

I don't know of a more appropriate solution to prevent panning. Why do you want to prevent panning?

Thanks

Ben

--

You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.

To view this discussion on the web visit https://groups.google.com/d/msg/google-maps-js-api-v3/-/DA9eQ27QO-IJ.