Panoramica
L'API di Google Maps fornisce riquadri di mappe a vari livelli di zoom per le immagini dei tipi di mappa. Ad esempio, la maggior parte delle immagini della mappa stradale è disponibile dai livelli di zoom da 0 a 18. Le immagini satellitari variano maggiormente, in quanto non vengono generate, ma fotografate direttamente.
Poiché le immagini satellitari non sono sempre disponibili a livelli di zoom elevati per località remote, aree scarsamente popolate o aree oceaniche aperte, potresti voler conoscere in anticipo il livello di zoom più elevato per le immagini in una determinata località. L'oggetto MaxZoomService fornisce un'interfaccia semplice per scoprire il livello di zoom massimo in una determinata località per cui Google Maps dispone di immagini satellitari.
Richieste MaxZoom
L'accesso a MaxZoomService è asincrono, poiché l'API di Google Maps deve effettuare una chiamata a un server esterno. Per questo motivo, devi passare un metodo di callback da eseguire al completamento della richiesta. Questo metodo di callback deve elaborare il risultato.
Per avviare una richiesta a MaxZoomService, chiama getMaxZoomAtLatLng(), passando LatLng della località e una funzione di callback da eseguire al completamento della richiesta.
Risposte MaxZoom
Quando getMaxZoomAtLatLng() esegue la funzione di callback, restituisce due parametri:
statuscontiene ilMaxZoomStatusdella richiesta.zoomcontiene il livello di zoom. Se per qualche motivo il servizio non va a buon fine, questo valore non sarà presente.
Il codice status potrebbe restituire uno dei seguenti valori:
OKindica che il servizio ha trovato il livello di zoom massimo per le immagini satellitari.ERRORindica che la richiesta MaxZoom non è stata elaborata.
L'esempio seguente mostra una mappa dell'area metropolitana di Tokyo. Se fai clic in un punto qualsiasi della mappa, viene indicato il livello di zoom massimo in quella posizione. (I livelli di zoom intorno a Tokyo variano generalmente tra 18 e 21).
TypeScript
let map: google.maps.Map; let maxZoomService: google.maps.MaxZoomService; let infoWindow: google.maps.InfoWindow; function initMap(): void { map = new google.maps.Map(document.getElementById("map") as HTMLElement, { zoom: 11, center: { lat: 35.6894, lng: 139.692 }, mapTypeId: "hybrid", }); infoWindow = new google.maps.InfoWindow(); maxZoomService = new google.maps.MaxZoomService(); map.addListener("click", showMaxZoom); } function showMaxZoom(e: google.maps.MapMouseEvent) { maxZoomService.getMaxZoomAtLatLng( e.latLng as google.maps.LatLng, (result: google.maps.MaxZoomResult) => { if (result.status !== "OK") { infoWindow.setContent("Error in MaxZoomService"); } else { infoWindow.setContent( "The maximum zoom at this location is: " + result.zoom ); } infoWindow.setPosition(e.latLng); infoWindow.open(map); } ); } declare global { interface Window { initMap: () => void; } } window.initMap = initMap;
JavaScript
let map; let maxZoomService; let infoWindow; function initMap() { map = new google.maps.Map(document.getElementById("map"), { zoom: 11, center: { lat: 35.6894, lng: 139.692 }, mapTypeId: "hybrid", }); infoWindow = new google.maps.InfoWindow(); maxZoomService = new google.maps.MaxZoomService(); map.addListener("click", showMaxZoom); } function showMaxZoom(e) { maxZoomService.getMaxZoomAtLatLng(e.latLng, (result) => { if (result.status !== "OK") { infoWindow.setContent("Error in MaxZoomService"); } else { infoWindow.setContent( "The maximum zoom at this location is: " + result.zoom, ); } infoWindow.setPosition(e.latLng); infoWindow.open(map); }); } window.initMap = initMap;