Google Maps v3 API расширяет границы. Javascript How-To?

Question

function initialize(){
// Creating a map
var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 10,
  center: new google.maps.LatLng(53.0123601276819, -2.44519164333635),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var m = [];

function addMarker(title, lat, lng) {
    m[m.length] = new google.maps.Marker({
        position: new google.maps.LatLng(lat, lng),
        map: map,
        title: title,  
        clickable: true,
        icon: 'http://domain.com/MVC/images/full.png' 
    });

} 

addMarker('Home', 53.0682143712504, -2.52150736731894);
addMarker('Away', 53.0123601276819, -2.44519164333635);
addMarker('Away', 59.0123601276819, -2.44519164333635);    

// Create a LatLngBounds object
var bounds = new google.maps.LatLngBounds(); 

for (var i = 0; i < m.length; i++) {
  // Insert code to add marker to map here

  // Extend the LatLngBound object
  bounds.extend(m[i]);

}
alert(m[0]);
map.fitBounds(bounds);
  document.write(getBounds());   

}

Выше мой код.

Я намерен разработать карту, на которой будут отображены многочисленные маркеры и увеличено изображение, чтобы все маркеры помещались на моем экране.

Я новичок в JS.

Мойпонимание состоит в том, что

var m = [];

создает пустой массив.

Затем каждый раз, когда я вызываю addMarker(), детали добавляются в этот массив m

В верхней части я устанавливаюмасштаб по умолчанию и центральная точка.

Затем я добавляю различные маркеры.

Затем я перебираю все ключи в массиве m и расширяю границы, используя данные из этого.

Тогда я понимаю, что map.fitBounds(bounds); должен переопределить масштаб / центр, если это применимо, чтобы соответствовать всем маркерам.

Это не так.Все мои маркеры показывают, но зум / центр не настраивается автоматически, и я понятия не имею, почему.

Любой совет будет принят с благодарностью.Спасибо

Answer 1

Вам необходимо передать объект LatLng в функцию bounds.extend.

Вот код:

....
bounds.extend(new google.maps.LatLng(lat, lng));
....

Answer 2

Вот пояснение приведенного выше ответа, которое является правильным, за исключением того, что в нем отсутствует скобка и немного краткого описания.

//make an empty bounds variable
var bounds = new google.maps.LatLngBounds();


//do your map stuff here
//special note: make sure your lat and lng are integers or googleMaps will error
var lat = 38.103;
var lng = -121.572;
bounds.extend(new google.maps.LatLng(lat, lng));


//adjust the viewport of the map
//special note: this only needs to be done once, don't put it in a loop
map.fitBounds(bounds);