Sobreposições de solo

Mantenha tudo organizado com as coleções Salve e categorize o conteúdo com base nas suas preferências.
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, elas se movem quando você arrasta o mapa ou aplica zoom a ele. Para colocar uma imagem em um mapa, use um objeto GroundOverlay.

Para ver outras informações sobre outros tipos de sobreposição, consulte Como 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 será renderizada no mapa, restrita aos limites indicados e ajustada de acordo com 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;

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;
Ver exemplo

Testar amostra

Remover uma sobreposição de solo

Para remover uma sobreposição de um mapa, chame o método setMap() da sobreposição, transmitindo null. Chamar esse método não exclui a sobreposição. Ela remove a sobreposição do mapa. Se quiser excluí-la, remova-a do mapa e defina a própria sobreposição como null.

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

Ver exemplo