Google Maps v3: Enforcing min. niveau de zoom lors de l'utilisation de fitBounds

Question

Je dessine une série de marqueurs sur une carte (en utilisant la v3 des cartes api).

Dans v2, j'avais le code suivant:

bounds = new GLatLngBounds(); 

    ... loop thru and put markers on map ... 
    bounds.extend(point); 
    ... end looping 

    map.setCenter(bounds.getCenter()); 
    var level = map.getBoundsZoomLevel(bounds); 
    if (level == 1) 
    level = 5; 
    map.setZoom(level > 6 ? 6 : level); 

Et ce beau travail pour assurer qu'il y avait toujours un niveau de détail approprié affiché sur la carte.

Je suis en train de dupliquer cette fonctionnalité dans v3, mais le setZoom et fitBounds ne semblent pas coopérer:

... loop thru and put markers on the map 
    var ll = new google.maps.LatLng(p.lat,p.lng); 
    bounds.extend(ll); 
... end loop 

var zoom = map.getZoom(); 
map.setZoom(zoom > 6 ? 6 : zoom); 
map.fitBounds(bounds); 

J'ai essayé différentes permutations (déplacer les fitBounds avant la setZoom, pour exemple) mais rien de ce que je fais avec setZoom ne semble affecter la carte. Est-ce que je manque quelque chose? Y a-t-il un moyen de faire cela?

Answer 1

Je me suis trouvé à la recherche de la même chose :)

A cette discussion sur Google Groups j'ai découvert que, fondamentalement, quand vous faites un fitBounds, le zoom se de façon asynchrone, vous devez capturer le zoom et les limites événement de changement. Le code dans le post final a fonctionné pour moi avec une petite modification ... dans l'état actuel il vous arrête de zoomer plus de 15 complètement, donc utilisé l'idée du quatrième post pour avoir un drapeau réglé pour le faire seulement la première fois.

// Do other stuff to set up map 
var map = new google.maps.Map(mapElement, myOptions); 
// This is needed to set the zoom after fitbounds, 
google.maps.event.addListener(map, 'zoom_changed', function() { 
    zoomChangeBoundsListener = 
     google.maps.event.addListener(map, 'bounds_changed', function(event) { 
      if (this.getZoom() > 15 && this.initialZoom == true) { 
       // Change max/min zoom here 
       this.setZoom(15); 
       this.initialZoom = false; 
      } 
     google.maps.event.removeListener(zoomChangeBoundsListener); 
    }); 
}); 
map.initialZoom = true; 
map.fitBounds(bounds); 

espoir qui aide,

Anthony.

Answer 2

Sans essayer, je dirais que vous devriez être en mesure de le faire tout en ayant fitBounds() avant d'obtenir le niveau de zoom, à savoir

map.fitBounds(bounds); 
var zoom = map.getZoom(); 
map.setZoom(zoom > 6 ? 6 : zoom); 

Si vous avez essayé et que cela n'a pas fonctionné, vous pouvez configurer votre carte avec minZoom dans le MapOptions^{(api-reference)} comme ceci:

var map = new google.maps.Map(document.getElementById("map"), { minZoom: 6 }); 

cela garderait la carte de zoom plus loin lors de l'utilisation fitBounds().

Answer 3

La solution d'Anthony est très belle. Je ne devais fixer le zoom pour la charge de la page inital (veiller à ce que vous pas trop loin zoomé pour commencer) et cela a fait l'affaire pour moi:

var zoomChangeBoundsListener = 
    google.maps.event.addListener(map, 'bounds_changed', function(event) { 
     google.maps.event.removeListener(zoomChangeBoundsListener); 
     map.setZoom(Math.min(15, map.getZoom())); 
    }); 


map.fitBounds(zoomBounds); 

Answer 4

Dans mon cas, je voulais simplement Réglez le niveau de zoom sur un de moins que ce que Google Maps a choisi pour moi pendant FitBounds. Le but était d'utiliser fitBounds, mais aussi de s'assurer qu'aucun marqueur ne se trouvait sous les outils de mappage, etc.

Ma carte est créée tôt, puis un certain nombre d'autres composants dynamiques de la page ont la possibilité d'ajouter des marqueurs, appelant fitBounds après chaque ajout.

Ceci est dans le bloc initial dans lequel l'objet carte est créé à l'origine ...

var mapZoom = null; 

Ensuite, ceci est ajouté à chaque bloc où un marqueur est ajouté, juste avant le map.fitBounds est appelé .. .

google.maps.event.addListenerOnce(map, 'bounds_changed', function() { 
    if (mapZoom != map.getZoom()) { 
     mapZoom = (map.getZoom() - 1); 
     map.setZoom(mapZoom); 
    } 
}); 

Lorsque vous utilisez « bounds_changed » sans le contrôle en place, la carte zoomée une fois pour chaque marqueur, peu importe que ce soit nécessaire ou non. Inversement, lorsque j'utilisais 'zoom_changed', j'avais parfois des marqueurs sous les outils de mappage car le zoom ne changeait pas réellement. Maintenant, il est toujours déclenché, mais le contrôle garantit qu'il ne fait qu'un zoom arrière une fois et seulement si nécessaire.

Espérons que cela aide.

Answer 5

Lorsque vous appelez map.fitBounds() sur un élément - la carte peut zoomer de trop près. Pour corriger cela, il suffit d'ajouter « maxZoom » à mapOptions ...

var mapOptions = { 
    maxZoom: 15 
}; 

Answer 6

Depuis Google Maps V3 est event driven, vous pouvez dire à l'API pour remettre le zoom à une quantité appropriée lorsque le zoom_changed déclencheurs d'événements :

var initial = true 
google.maps.event.addListener(map, "zoom_changed", function() { 
    if (initial == true){ 
     if (map.getZoom() > 11) { 
     map.setZoom(11); 
     initial = false; 
     } 
    } 
}); 

I utilisé initial pour rendre la carte ne zoom trop quand les éventuels fitBounds est permorfed, mais de laisser le zoom utilisateur autant qu'il/elle veut. Sans cette condition, tout événement zoom supérieur à 11 serait possible pour l'utilisateur.

Answer 7

Vous pouvez également définir l'option maxZoom juste avant d'appeler fitBounds() et réinitialiser la valeur après:

if(!bounds.isEmpty()) { 
    var originalMaxZoom = map.maxZoom; 
    map.setOptions({maxZoom: 18}); 
    map.fitBounds(bounds); 
    map.setOptions({maxZoom: originalMaxZoom}); 
}