Utilisation de setZoom () après l'utilisation de fitBounds () avec Google Maps API V3

Question

Je suis en utilisant fitBounds() pour définir le niveau de zoom sur ma carte aussi inclure tous les marqueurs qui est actuellement affichée. Cependant, lorsque je n'ai qu'un marqueur visible, le niveau de zoom est à 100% (... le niveau de zoom de 20 je crois...). Cependant, je ne veux pas qu'il soit loin de zoom de sorte que l'utilisateur peut ajuster la position du marqueur, sans avoir à effectuer un zoom arrière.

J'ai le code suivant:

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++;

où cela.carte.limites précédemment définies comme suit:

this.map.bounds = new google.maps.LatLngBounds();

Cependant, le problème que j'ai est que la ligne this.map.map.setZoom(16); ne fonctionne pas si j'utilise this.map.map.fitBounds(this.map.bounds);, cependant, je sais que la ligne de code est correct, parce que quand je commenter la fitBound() en ligne, le setZoom() comme par magie commence à fonctionner.

Des idées comment je résoudre ce problème? Je suis en train de réfléchir à mettre un par maxzoom niveau comme une alternative si je ne peux pas obtenir ce travail.

Answer 1

Bon, je l'ai compris. Apparemment, le fitbounds () se produit de manière asynchrone, vous devez donc attendre un événement bounds_changed avant de définir le zoom.

 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);
 

Answer 2

 google.maps.event.addListenerOnce(yourMap, 'bounds_changed', function(event) {
  if (this.getZoom() > 15) {
    this.setZoom(15);
  }
});
 

Cette solution fonctionne mieux… au lieu d'attendre le délai d'attente pour supprimer l'auditeur. Appelez-le directement avant d’utiliser fitBounds (je crois que l’appel après fonctionnera également).

Answer 3

J'ai trouvé le zoom supplémentaire un peu choquant. Si vous définissez l'option maxZoom avant d'appeler fitBounds (puis désélectionnez-la dans le rappel), vous pouvez l'éviter:

 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
    });
});
 

Answer 4

J'ai une solution simple et sale.
Utilisez sinon ...

 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++;
 

Answer 5

Je viens d'ajouter une ligne à la fonction addBounds(position) et elle l'a corrigée, comme le montre ce qui suit:

     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;
    },