Annuncio: a breve su Google Maps Platform saranno disponibili nuovi stili della mappa di base. Questo aggiornamento dello stile della mappa include una nuova tavolozza dei colori predefinita, indicatori modernizzati e miglioramenti alle esperienze e all'usabilità delle mappe. Tutti gli stili di mappa verranno aggiornati automaticamente a marzo 2025. Per ulteriori informazioni sulla disponibilità e su come attivare in anteprima questa funzionalità, consulta Nuovo stile di mappa per Google Maps Platform.

Questa pagina è stata tradotta dall'API Cloud Translation.

Overlay del suolo
Mantieni tutto organizzato con le raccolte Salva e classifica i contenuti in base alle tue preferenze.

Seleziona la piattaforma: Android iOS JavaScript

Introduzione
Aggiungere un overlay del suolo
Rimuovere un overlay del suolo

Introduzione

Gli overlay sono oggetti sulla mappa legati alle coordinate di latitudine/longitudine, quindi si spostano quando trascini la mappa o ne aumenti lo zoom. Se vuoi inserire un'immagine su una mappa, puoi utilizzare un oggetto GroundOverlay.

Per informazioni su altri tipi di overlay, consulta Disegnare sulla mappa.

Aggiungere un overlay del suolo

Il costruttore di un GroundOverlay specifica un URL di un'immagine e il LatLngBounds dell'immagine come parametri. L'immagine verrà visualizzata sulla mappa, limitata ai limiti specificati e conforme alla proiezione della mappa.

TypeScript

// This example uses a GroundOverlay to place an image on the map
// showing an antique map of Newark, NJ.

let historicalOverlay;

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 13,
      center: { lat: 40.74, lng: -74.18 },
    }
  );

  const imageBounds = {
    north: 40.773941,
    south: 40.712216,
    east: -74.12544,
    west: -74.22655,
  };

  historicalOverlay = new google.maps.GroundOverlay(
    "https://storage.googleapis.com/geo-devrel-public-buckets/newark_nj_1922-661x516.jpeg",
    imageBounds
  );
  historicalOverlay.setMap(map);
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;index.ts

JavaScript

// This example uses a GroundOverlay to place an image on the map
// showing an antique map of Newark, NJ.
let historicalOverlay;

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 13,
    center: { lat: 40.74, lng: -74.18 },
  });
  const imageBounds = {
    north: 40.773941,
    south: 40.712216,
    east: -74.12544,
    west: -74.22655,
  };

  historicalOverlay = new google.maps.GroundOverlay(
    "https://storage.googleapis.com/geo-devrel-public-buckets/newark_nj_1922-661x516.jpeg",
    imageBounds,
  );
  historicalOverlay.setMap(map);
}

window.initMap = initMap;index.js

Visualizza esempio

Prova Sample

JSFiddle.net Google Cloud Shell

Rimuovere un overlay del suolo

Per rimuovere un overlay da una mappa, chiama il metodo setMap() dell'overlay, passando null. Tieni presente che la chiamata a questo metodo non elimina l'overlay. Rimuove l'overlay dalla mappa. Se invece vuoi eliminare l'overlay, deve rimuoverlo dalla mappa e impostare l'overlay stesso su null.

function removeOverlay() {
  historicalOverlay.setMap(null);
}