Automatische Anpassung des Zooms zur Aufnahme aller Markierungen in einer Google-Karte

Question

Verwendung der neuesten Version von Google Maps. Wie fügt man Marker mit Längen- und Breitengrad hinzu und passt automatisch die Zoomstufe der Karte an, um alle Marker mit JavaScript einzubinden?

Answer 1

Google Maps API v3 bietet ein LatLngBounds Objekt, zu dem Sie mehrere LatLng Objekte hinzufügen können. Sie können diese dann zu Map.fitBounds() Funktion übergeben, wie hier beschrieben:

• Zoom-To-Fit All Markers, Polylines or Polygons on A Google Map - API v2
• Zoom-to-Fit All Markers on Google Map v3

Teil Beispiel

var latlng = [ 
    new google.maps.LatLng(1.23, 4.56), 
    new google.maps.LatLng(7.89, 1.01), 
    // ... 
]; 
var latlngbounds = new google.maps.LatLngBounds(); 
for (var i = 0; i < latlng.length; i++) { 
    latlngbounds.extend(latlng[i]); 
} 
map.fitBounds(latlngbounds); 

Answer 2

Sie fügen Marker zur Karte google durch ein marker Objekt für jeden Ihrer Breite/Länge Paare Instanziierung:

var marker = new google.maps.Marker({ 
    position: currentLatLng, 
    map: map, 
    title:"Title!" 
}); 

Die map Option auf den Marker constructer wird den neuen Markt Objekt mit Ihrer Karte zuzuordnen.

Um Ihre Karte zu vergrößern, um Ihre neuen Markierungen einzuschließen, verwenden Sie die fitBounds Methode auf dem Objekt map. fitBounds verwendet ein Objekt latLngBounds als Parameter. Dieses Objekt verfügt über eine handliche extend Methode, die die Grenzen anpassen, um eine neue Breite/Länge zu enthalten. Sie müssen also nur alle Ihre Punkte durchblättern und extendieren auf einem einzigen latLngBounds-Objekt. Dadurch werden die Grenzen so erweitert, dass sie alle Ihre Marker enthalten. Sobald Sie dies getan haben, übergeben Sie dieses Objekt in die fitBounds Methode auf der map und es wird zoomen, um alle Ihre neuen Marker anzuzeigen.