放大到多個標記界限不起作用

Question

我正在添加一些標記到地圖，這是工作正常，但我不能設置地圖縮放到所有標記的邊界（擴展）。你能讓我知道我做錯了什麼嗎？

// Multiple Markers 
var markers = [ 
    ['Tacloban', 11.247524,125.00463], 
    ['Guiuan', 11.034212,125.731659], 
    ['Ormoc', 11.026798,124.600754], 
    ['Cebu', 10.31019,123.881836], 
    ['Roxas', 11.59036,122.763977] 

]; 
    google.maps.event.addDomListener(document.getElementById('alloffice'), 'click', function() { 
    map.setCenter(latlngOfficeAall); 
    map.setZoom(8); 
// Loop through our array of markers & place each one on the map 
    for(i = 0; i < markers.length; i++) { 
     var position = new google.maps.LatLng(markers[i][1], markers[i][2], markers[i][3], markers[i][4], markers[i][5]); 
     bounds.extend(position); 
     marker = new google.maps.Marker({ 
      position: position, 
      map: map, 
      title: markers[i][0] 
     }); 
     } 

    }); 

Answer 1

你需要告訴地圖中心和縮放與map.fitBounds(bounds)

// Multiple Markers 
var markers = [ 
    ['Tacloban', 11.247524,125.00463], 
    ['Guiuan', 11.034212,125.731659], 
    ['Ormoc', 11.026798,124.600754], 
    ['Cebu', 10.31019,123.881836], 
    ['Roxas', 11.59036,122.763977] 

]; 

google.maps.event.addDomListener(document.getElementById('alloffice'), 'click', function() { 
    var bounds = new google.maps.LatLngBounds(); 
    // Loop through our array of markers & place each one on the map 
    for(i = 0; i < markers.length; i++) { 
    var position = new google.maps.LatLng(markers[i][1], markers[i][2], markers[i][3], markers[i][4], markers[i][5]); 
    bounds.extend(position); 
    marker = new google.maps.Marker({ 
     position: position, 
     map: map, 
     title: markers[i][0] 
    }); 
    } 
    map.fitBounds(bounds); 
}); 

working example