Comment définir le niveau de zoom pour afficher tous les marqueurs sur Google Maps?Comment définir le niveau de zoom de Google Map pour afficher tous les marqueurs?
Dans ma carte Google, il existe différents marqueurs dans différentes positions. Je veux régler le niveau de zoom de la carte google basé sur la gamme de marqueurs (cela signifie que dans la vue de la carte google, je veux voir tous les marqueurs)
Il vous allez:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps getBoundsZoomLevel Demo</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false"
type="text/javascript"></script>
</head>
<body onunload="GUnload()">
<div id="map" style="width: 400px; height: 300px"></div>
<script type="text/javascript">
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
var markerBounds = new GLatLngBounds();
for (var i = 0; i < 10; i++) {
var randomPoint = new GLatLng(39.00 + (Math.random() - 0.5) * 20,
-77.00 + (Math.random() - 0.5) * 20);
map.addOverlay(new GMarker(randomPoint));
markerBounds.extend(randomPoint);
}
map.setCenter(markerBounds.getCenter(),
map.getBoundsZoomLevel(markerBounds));
}
</script>
</body>
</html>
Nous créons 10 points aléatoires dans l'exemple ci-dessus, puis en passant chaque point à GLatLngBounds.extend(). Enfin, nous obtenons le bon niveau de zoom avec GMap2.getBoundsZoomLevel().
Vous pouvez utiliser la méthode extend de l'objet GLatLngBounds, ce qui représente un rectangle sur la carte.
var bounds = new GLatLngBounds();
boucle autour de tous les points sur votre carte, étendre les limites de votre GLatLngBounds objet pour chacun.
bounds.extend(myPoint);
Enfin, vous pouvez utiliser vos limites objet pour définir le centre et le zoom de votre carte (où map est votre objet map)
map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
Si vous utilisez la version API 3, vous pouvez remplacer
map.setCenter(markerBounds.getCenter(), map.getBoundsZoomLevel(markerBounds));
avec
map.fitBounds(markerBounds).
définir le niveau de zoom Google Map pour afficher tous les marqueurs?
var markers = [markerObj1, markerObj2, markerObj3];
var newBoundary = new google.maps.LatLngBounds();
for(index in markers){
var position = markers[index].position;
newBoundary.extend(position);
}
map.fitBounds(newBoundary);
Le code ci-dessus centrera et zoomera automatiquement votre carte afin que tous les marqueurs soient visibles.
Cela ne fonctionne que pour v2 – Jaseem