sehummel
sehummel

Reputation: 5568

GoogleMaps: map not extending bounds to view all markers

I'm having a problem. I have an array of locations of our dealers. It's called locations. The first item in each group is the latitude and the last item in each group is the longitude. I get back a map with all of the locations on it correctly, except it zooms in on one of the locations. It has to be something with the bounds, but I'm not sure what. Can someone help? Thanks.

Here's my code:

var map = new google.maps.Map(document.getElementById('map'), {
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });

var marker, i;

if (locations.length > 1) { 
    var bounds = new google.maps.LatLngBounds();
    for (i = 0; i < locations.length; i++) {  
        marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][0], locations[i][1]),
                    map: map
                });
    }

    bounds.extend(marker.getPosition());              

    map.fitBounds(bounds);

Upvotes: 1

Views: 2254

Answers (2)

Daniele B
Daniele B

Reputation: 3125

It seems that wth your code you get the position of the last marker and say to the map to fit to that. You do that with the

bounds.extend(marker.getPosition());              

    map.fitBounds(bounds);

if you want to fit to all the markers, then put

bounds.extend(m[i]);

in the for cycle after the marker.

A similar answer explains even better: Google Maps v3 API Extend Bounds. Javascript How-To?

Upvotes: 0

Heitor Chang
Heitor Chang

Reputation: 6057

I think you want bounds.extend inside the for loop. The way I see it, it's only taking a single marker's position.

Upvotes: 2

Related Questions