Sobreposições de solo

Selecione a plataforma: Android iOS JavaScript
  1. Introdução
  2. Adicionar uma sobreposição de solo
  3. Remover uma sobreposição de solo

Introdução

As sobreposições são objetos no mapa vinculados a coordenadas de latitude/longitude. Portanto, eles se movem quando você arrasta ou aplica zoom no mapa. Para inserir uma imagem em um mapa, use um objeto GroundOverlay.

Para informações sobre outros tipos de sobreposição, consulte Desenhar no mapa.

Adicionar uma sobreposição de solo

O construtor de um GroundOverlay especifica o URL de uma imagem e o LatLngBounds da imagem como parâmetros. A imagem é renderizada no mapa, restrita aos limites informados e adaptada usando a projeção do mapa.

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
Exemplo

Testar amostra

Remover uma sobreposição de solo

Para remover uma superposição de um mapa, chame o método setMap() da superposição, passando null. A chamada desse método não elimina a sobreposição. Ela só remove a sobreposição do mapa. Se, em vez disso, você quiser excluir a superposição, vai precisar remover essa opção do mapa e definir a própria superposição como null.

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

Exemplo