Sunday, May 08, 2011

Sizing Google Maps viewport to data

Now we've got markers and our hard-coded map center isn't working out for us anymore. So we'll add the ability to move around (zoom in/out and pan) using some out-of-box controls. Import the controls

import com.google.maps.controls.*;

and in onMapReady, enable the maptype on the top right and the navigation control on top left

var mapTypeControl:MapTypeControl = new MapTypeControl();
mapTypeControl.setControlPosition(new ControlPosition(ControlPosition.ANCHOR_TOP_RIGHT, 10, 5));
map.addControl(mapTypeControl);
var navigationControl:NavigationControl = new NavigationControl();
navigationControl.setControlPosition(new ControlPosition(ControlPosition.ANCHOR_TOP_LEFT, 10, 5));
map.addControl(navigationControl);

importing LatLngBounds class will allow you to size the viewport to the data retrieved. this little trick makes your map a lot more dynamic



and the result

No comments: