Ich verwende fitBounds (), um die Zoomstufe auf meiner Karte festzulegen. Dazu gehören auch alle derzeit angezeigten Markierungen. Wenn jedoch nur eine Markierung sichtbar ist, beträgt die Zoomstufe 100% (... welche Zoomstufe 20, glaube ich ...). Ich möchte jedoch nicht, dass es so weit hineingezoomt wird, damit der Benutzer die Position des Markers anpassen kann, ohne herauszoomen zu müssen.
Ich habe folgenden Code:
var marker = this.map.createMarker(view.latlng, this.markerNumber);
this.map.bounds.extend(view.latlng);
this.map.map.setCenter(this.map.bounds.getCenter());
this.map.map.fitBounds(this.map.bounds);
if (this.markerNumber === 1) {
this.map.map.setZoom(16);
}
this.markerNumber++;
Dabei wurde this.map.bounds zuvor definiert als:
this.map.bounds = new google.maps.LatLngBounds();
Das Problem, das ich habe, ist jedoch, dass die Zeile this.map.map.setZoom(16);
nicht funktioniert, wenn ich sie verwende this.map.map.fitBounds(this.map.bounds);
. Ich weiß jedoch, dass die Codezeile korrekt ist, da setZoom () beim Kommentieren der Zeile fitBound () auf magische Weise funktioniert.
Irgendwelche Ideen, wie ich das lösen kann? Ich denke darüber nach, eine maxZoom-Stufe als Alternative einzustellen, wenn dies nicht funktioniert.
quelle
Antworten:
Okay, ich habe es herausgefunden. Anscheinend geschieht fitbounds () asynchron, sodass Sie auf ein
bounds_changed
Ereignis warten müssen, bevor die Einstellung des Zooms funktioniert.map = this.map.map; map.fitBounds(this.map.bounds); zoomChangeBoundsListener = google.maps.event.addListenerOnce(map, 'bounds_changed', function(event) { if (this.getZoom()){ this.setZoom(16); } }); setTimeout(function(){google.maps.event.removeListener(zoomChangeBoundsListener)}, 2000);
Update : In der Antwort von @ Nequin finden Sie
addListenerOnce
eine bessere Lösung, für die keine Zeitüberschreitung erforderlich ist.quelle
addListenerOnce()
was denremoveListener()
Anruf abschaffen würde .google.maps.event.addListenerOnce(yourMap, 'bounds_changed', function(event) { if (this.getZoom() > 15) { this.setZoom(15); } });
Diese Lösung funktioniert besser ... anstatt auf eine Zeitüberschreitung zu warten, um den Listener zu entfernen. Rufen Sie dies direkt vor der Verwendung auf
fitBounds
(ich glaube, dass das Anrufen danach auch funktioniert).quelle
google.maps.event.addListenerOnce
indem Sie den Listener verwenden, anstatt ihn hinzuzufügen und dann zu entfernen.addListenerOnce
.if (yourMap.getZoom() > 15) { ... }
. Es scheint, dass @horace Probleme damit hatte und dies bezieht sich wahrscheinlich auf die aktuelle Klasse, in der die Implementierung durchgeführt wird, oder auf diegoogle.maps.event
Instanz. Vermeiden Sie dies, wenn Sie einfach den übergebenen Verweis auf Ihre Karte verwenden möchten.Ich fand den zusätzlichen Zoom etwas verwirrend. Wenn Sie die Option maxZoom festlegen, bevor Sie fitBounds aufrufen (und sie dann im Rückruf deaktivieren), können Sie dies vermeiden:
map.setOptions({ maxZoom: 10 }); map.setCenter(new google.maps.LatLng(-89, -179)); // make sure it changes so the idle listener gets called back map.fitBounds(bounds); var listener = google.maps.event.addListenerOnce(map, "idle", function() { map.setOptions({ maxZoom: 999 }); });
quelle
Ich habe eine einfache und schmutzige Lösung.
Verwenden Sie If else ...
var marker = this.map.createMarker(view.latlng, this.markerNumber); this.map.bounds.extend(view.latlng); this.map.map.setCenter(this.map.bounds.getCenter()); if (this.markerNumber === 1) { this.map.map.setZoom(16); } else { this.map.map.fitBounds(this.map.bounds); } this.markerNumber++;
quelle
Ich habe der Funktion nur eine Zeile hinzugefügt
addBounds(position)
und sie wurde behoben, wie Folgendes zeigt:addBounds: function(position) { this.get('bounds', new google.maps.LatLngBounds()).extend(this._latLng(position)); this.get('map').fitBounds(this.get('bounds')); this.get('map').setZoom(16);//line added return this; },
quelle
Alle Lösungen mit Ereignis-Listenern haben bei mir nicht funktioniert (this.getZoom () ist im Rückruf immer undefiniert und this.setZoom () hat keine Auswirkung).
Ich habe mir diese Lösung ausgedacht, die gut funktioniert hat:
function set_zoom() { if(map.getZoom()) {map.setZoom(map.getZoom() - 1);} else {setTimeout(set_zoom, 5);} } setTimeout(set_zoom, 5);
quelle