NicoJuicy NicoJuicy - 9 months ago 53
Javascript Question

Google Maps v3 - Automating Zoom Level?

I'm having the possibility to have multiple markers.

Currently i'm using the


In my css to have the map resized (bounds contains multiple latlng's).

What am i doing wrong? Because it won't use the best zoom level :-(
alt text


Javascript source

var geocoder, map;
var coll_gmap = $(".gmap");
if ( coll_gmap.length != 0 )
//initiate map
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 13,
center: latlng,
mapTypeControl: true,
navigationControl: true,
scaleControl: true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.ZOOM_PAN},
mapTypeId: google.maps.MapTypeId.ROADMAP
var bounds = new google.maps.LatLngBounds();
//loop all addressen + insert into map
map = new google.maps.Map(coll_gmap[0], myOptions);
if (geocoder) {
geocoder.geocode( { 'address': $(this).attr("address")}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {

var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
} else {
console.log("Geocode was not successful for the following reason: " + status);
}//end if status
}); //end if geocoder.geocode
} //end if geocoder

}) //end coll_gmap each

}//end if coll_gmap length
/* console.log("Script created by NicoJuicy");*/
}); //end onload

In html - Create this ;-)

Answer Source

I have found the solution.

Instead of doing a single


Everytime you add a myLatLng to your bounds, do these actions

bounds = map.getBounds();

Hope this helps anyone!