How to center and zoom multiple markers on Google Maps V3

Question

I use the following code:

 var geocoder;
    var map;
    var markers = [];
    function initialize() {
        geocoder = new google.maps.Geocoder();
        // var latlng = new google.maps.LatLng(51.733833,0.351563);
        var latlng = new google.maps.LatLng(53.590875,-2.279663);
        // var latlng = new Array (new google.maps.LatLng (52.537,-2.061), new google.maps.LatLng (52.564,-2.017));
        var myOptions = {
            zoom: 7,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        addPostCode('EX4 5SP');
        addPostCode('EX16 6LH');
        addPostCode('M1 2AP');

}

I found some example how to achieve this In the following code: Google MAP API v3: Center & Zoom on displayed markers to achieve this, the following code is used.

// map: an instance of GMap3
// latlng: an array of instances of GLatLng
var latlngbounds = new google.maps.LatLngBounds();
latlng.each(function(n){
   latlngbounds.extend(n);
});
map.setCenter(latlngbounds.getCenter());
map.fitBounds(latlngbounds);

The problem is that I need to use Postcodes to display the location on the map. Is is possible to create an array of instances of GLatLng from a postcode and then use the above code to zoom and center the multiple markers on map?

GLatLng is from Google Maps API v2, not v3. You mean an array of instances of google.maps.LatLng I hope? — duncan, Dec 09 '13 at 13:01
possible duplicate of [Google Maps API v3 - fitBounds after multiple geocoder requests](http://stackoverflow.com/questions/11336405/google-maps-api-v3-fitbounds-after-multiple-geocoder-requests) — geocodezip, Dec 09 '13 at 13:49

score 3 · Answer 1 · edited May 23 '17 at 11:45

3

GClientGeocoder can take a postal code and return a GLatLng: see https://groups.google.com/forum/#!topic/google-maps-api/JN8OW5Tyaws.

For centering multiple markers, see Find center of multiple locations in Google Maps

Yes this is V2-- the GLatLng threw me. The same functionality exists in V3: https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple

edited May 23 '17 at 11:45

Community

1
1

answered Dec 09 '13 at 12:14

dhc

647
8
17

GClientGeocoder is from the deprecated Google Maps API v2, @Roman's using API v3 (despite his misleading reference to GLatLng) – duncan Dec 09 '13 at 13:02
I have solved my problem of converting postcodes to lat/long by calling the following url in ColdFusion: This returns the json with lat/long.Thank you for your help. – Roman Dec 11 '13 at 08:31

score 1 · Answer 2 · edited Mar 21 '16 at 04:42

//locationsColl containts list of co ordinates

var latlng = [];
_.forEach(locationsColl, function (address) {
    latlng.push(address);
});

var latlngbounds = new google.maps.LatLngBounds();
_.forEach(latlng,function (n) {
    latlngbounds.extend(n);
});
// center map to central point between markers
map.setCenter(latlngbounds.getCenter());
// set zoom to fit all coord
map.fitBounds(latlngbounds);

How to center and zoom multiple markers on Google Maps V3

2 Answers2