Google Maps API：動的に生成されたズームとセンターを検索しますか？

Question

私はjavascriptとデバッグで恐ろしいです（phpはfavです）。地図上に表示するリストを動的に生成するので、座標の中心を見つけて、すべてを表示する必要があります。ここで私が使用しているコードは、別のSOメンバーから見つけられたものです。

var map = null; 
    var markerArray = []; //create a global array to store markers 
    var locations = [ 
     ['Bondi Beach', -33.890542, 151.274856, 4, 'http://www.kjftw.com/sandbox/gmap/images/icons/numeric/red04.png'], 
     ['Coogee Beach', -33.923036, 151.259052, 5, 'http://www.kjftw.com/sandbox/gmap/images/icons/numeric/red05.png'], 
     ['Cronulla Beach', -34.028249, 151.157507, 3, 'http://www.kjftw.com/sandbox/gmap/images/icons/numeric/red03.png'], 
     ['Manly Beach', -33.80010128657071, 151.28747820854187, 2, 'http://www.kjftw.com/sandbox/gmap/images/icons/numeric/red02.png'], 
     ['Maroubra Beach', -33.950198, 187.259302, 1, 'http://www.kjftw.com/sandbox/gmap/images/icons/numeric/red01.png']]; 

    function initialize() { 
     var myOptions = { 
      zoom: 10, 
      center: new google.maps.LatLng(-33.80010128657071, 151.28747820854187), 
      mapTypeControl: true, 
      mapTypeControlOptions: { 
       style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
      }, 
      navigationControl: true, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

     google.maps.event.addListener(map, 'click', function() { 
      infowindow.close(); 
     }); 

     // Add markers to the map 
     // Set up markers based on the number of elements within the myPoints array 
     for (var i = 0; i < locations.length; i++) { 
      createMarker(new google.maps.LatLng(locations[i][1], locations[i][2]),locations[i][0], locations[i][3], locations[i][4]); 
     } 

     mc.addMarkers(markerArray, true); 
    } 

    var infowindow = new google.maps.InfoWindow({ 
     size: new google.maps.Size(150, 50) 
    }); 

    function createMarker(latlng, myTitle, myNum, myIcon) { 
     var contentString = myTitle; 
     var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      icon: myIcon, 
      zIndex: Math.round(latlng.lat() * -100000) << 5, 
      title: myTitle 
     }); 

     google.maps.event.addListener(marker, 'click', function() { 
      infowindow.setContent(contentString); 
      infowindow.open(map, marker); 
     }); 

     markerArray.push(marker); //push local var marker into global array 
    } 

    window.onload = initialize; 

これは（答えにあります）に必要な機能Google Maps API: Calculate Center/Zoom of Polyline で表示されますが、私はそれを実装する方法がわかりません。

Answer 1

このようなあなたのinitialize関数にその解決策を働いて試してみてください。

function initialize() { 

    ... 

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    google.maps.event.addListener(map, 'click', function() { 
     infowindow.close(); 
    }); 

    // instantiate the bounds object 
    var bounds = new google.maps.LatLngBounds(); 

    // Add markers to the map 
    // Set up markers based on the number of elements within the myPoints array 
    for (var i = 0; i < locations.length; i++) { 
     var locationLatLng = new google.maps.LatLng(locations[i][1], locations[i][2]); 

     createMarker(locationLatLng, 
        locations[i][0], 
        locations[i][3], 
        locations[i][4]); 

     bounds.extend(locationLatLng); 
    } 

    map.fitBounds(bounds); 

    ... 
} 

希望これは

を支援