Google Maps API V3 - Problème des résultats du géocoder avec les limites

Question

Objectif: Je veux avoir une fonction de recherche personnalisée (géocode) et pouvoir répertorier et cliquer sur chaque résultat et l'afficher sur la carte.

Recherché: Ajustez les limites de la carte / zoom en conséquence, c'est-à-dire à la recherche de "MA, USA" devrait zoomer la carte pour me permettre de voir tout l'état du Massachusetts, tout en recherchant "Boston, MA, USA" devrait zoomer sur la zone de Boston. Lors de la répertage de plusieurs résultats, il en va de même pour cliquer sur un résultat.

Publier: Je peux utiliser l'objet Geometry.bounds avec FitBounds - mais - certains résultats que vous obtenez en utilisant le géocoder n'ont pas cet objet Geometry.bounds.

Un exemple rapide: la recherche de "Boston" revient

Boston, MA, USA
Boston, IN, USA
Boston, KY, USA
Boston, GA 31626, États-Unis
Boston, Salem, VA 22713, États-Unis
Boston, NY 14025, États-Unis

"Boston, KY" et "Boston NY 14025" n'ont pas de limites.

Question: Existe-t-il un moyen fiable d'afficher un résultat géocodeur sur une carte au niveau du zoom approprié?

En ce moment, j'utilise quelque chose comme ça mais je trouve cela laid et cela ne résout pas le problème du zoom

if (results[0].geometry.bounds) {

    map.fitBounds(results[0].geometry.bounds);

} else {

    map.setCenter(results[0].geometry.location);
    // eventually set zoom here to some middle-range value (ugly)
}

Answer 1

Droit. Après avoir essayé les méthodes et les tests, il sort que:

1. la geometry.bounds L'objet est "OptionNaly renvoyé" comme le dit le doc
2. Nous ne savons pas exactement ce que le geometry.bounds L'objet est basé sur
3. geometry.bounds "peut ne pas correspondre à la fenêtre recommandée" et ne le fait pas souvent
4. geometry.bounds Renvoie un carré ou un rectangle de toute taille et de toute forme tandis que les fonctions de la fenêtre renvoient toujours un rectangle avec le même rapport d'aspect (environ 1,43), quelles que soient vos dimensions de conteneur de carte, pour autant que j'ai testé.

Vous trouverez ci-dessous l'exemple de San Francisco, en Californie, mentionné dans le doc.
En rouge en utilisant geometry.bounds et en bleu en utilisant les fonctions de la fenêtre.

La solution est assez simple et est fiable.

var resultBounds = new google.maps.LatLngBounds(

    results[0].geometry.viewport.getSouthWest(), 
    results[0].geometry.viewport.getNorthEast()
);

map.fitBounds(resultBounds);

Answer 2

L'objet de la fenêtre a les informations dont vous avez besoin pour créer un objet Bounds. Quelque chose comme ça:

var bounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(results[0].geometry.viewport.southwest.lat, results[0].geometry.viewport.southwest.lng),
    new google.maps.LatLng(results[0].geometry.viewport.northeast.lat, results[0].geometry.viewport.northeast.lng)
);

Ensuite, vous pouvez utiliser FitBounds sur cet objet New Bounds, tout comme vous le faites pour l'objet Bounds retourné. Comme ça:

map.fitBounds(bounds);