You need to use the fitBounds()
method.
var markers = [];//some array
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markers.length; i++) {
bounds.extend(markers[i]);
}
map.fitBounds(bounds);
Documentation from developers.google.com/maps/documentation/javascript:
fitBounds(bounds[, padding])
Parameters:
`bounds`: [`LatLngBounds`][1]|[`LatLngBoundsLiteral`][1] `padding` (optional): number|[`Padding`][1]
Return Value: None
Sets the viewport to contain the given bounds.
Note: When the map is set todisplay: none
, thefitBounds
function reads the map’s size as0x0
, and therefore does not do anything. To change the viewport while the map is hidden, set the map tovisibility: hidden
, thereby ensuring the map div has an actual size.