Google Map API v3 — set bounds and center

Question

I've recently switched to Google Maps API V3. I'm working of a simple example which plots markers from an array, however I do not know how to center and zoom automatically with respect to the markers.

I've searched the net high and low, including Google's own documentation, but have not found a clear answer. I know I could simply take an average of the co-ordinates, but how would I set the zoom accordingly?

function initialize() {   var myOptions = {     zoom: 10,     center: new google.maps.LatLng(-33.9, 151.2),       mapTypeId: google.maps.MapTypeId.ROADMAP   }   var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);    setMarkers(map, beaches); }   var beaches = [   ['Bondi Beach', -33.890542, 151.274856, 4],   ['Coogee Beach', -33.423036, 151.259052, 5],   ['Cronulla Beach', -34.028249, 121.157507, 3],   ['Manly Beach', -33.80010128657071, 151.28747820854187, 2],   ['Maroubra Beach', -33.450198, 151.259302, 1] ];  function setMarkers(map, locations) {    var image = new google.maps.MarkerImage('images/beachflag.png',       new google.maps.Size(20, 32),       new google.maps.Point(0,0),       new google.maps.Point(0, 32));     var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png',        new google.maps.Size(37, 32),       new google.maps.Point(0,0),       new google.maps.Point(0, 32));         var lat = map.getCenter().lat();        var lng = map.getCenter().lng();           var shape = {       coord: [1, 1, 1, 20, 18, 20, 18 , 1],       type: 'poly'   };   for (var i = 0; i < locations.length; i++) {     var beach = locations[i];     var myLatLng = new google.maps.LatLng(beach[1], beach[2]);     var marker = new google.maps.Marker({         position: myLatLng,         map: map,         shadow: shadow,         icon: image,         shape: shape,         title: beach[0],         zIndex: beach[3]     });   } } 

Answer 1

Yes, you can declare your new bounds object.

 var bounds = new google.maps.LatLngBounds(); 

Then for each marker, extend your bounds object:

bounds.extend(myLatLng); map.fitBounds(bounds); 

API: google.maps.LatLngBounds