Skip to content
This repository has been archived by the owner on Oct 21, 2024. It is now read-only.

Map Moving

tmcw edited this page Feb 1, 2012 · 2 revisions

Map provides several different ways to change the current center and zoom level, apart from setCenterZoom and setExtent.

Some of them are useful when wiring up map controls such as zoomIn and zoomOut, that go in and out by whole zoom levels, and panLeft, panRight, panDown and panUp that move in 100px increments.

When responding to mouse-wheel or gesture zooming events you'll probably want to use zoomByAbout:

// Madrid
var madridLocation = new MM.Location(40.4, -3.7);

// Madrid on screen:
var madridPoint = map.locationPoint(madridLocation);

// zoom in by one step, keeping SF in the same place on screen:
map.zoomByAbout(1, madridPoint);

When responding to mouse events, or scripting animation, you'll probably want to use the relative functions zoomBy and panBy:

// zoom in by one step:
map.zoomBy(1);

// scroll by 50,50:
map.panBy(50,50);

Modest Maps also provides a Polymaps-style getter-setter interface:

map.zoom(1); // sets zoom to 1

var newzoom = map.zoom(); // sets newzoom to 1

Also provided is .center() and .extent()

Restricting Map Movement

A few methods allow you to restrict where map movement goes, even if handlers or calls to setZoom() etc tell it to differently.

The nuclear option is setting map.coordLimits, but an easier API is:

// only let the map zoom between 5 and 6
map.setZoomRange(5, 6);
// this will set zoom to 6, since 10 is forbidden now
map.setZoom(10);
Clone this wiki locally