Zemin yer paylaşımları

Platform seçin: Android iOS JavaScript
  1. Giriş
  2. Zemin yer paylaşımı ekleme
  3. Zemin yer paylaşımını kaldırma

Giriş

Yer paylaşımları, haritada enlem/boylam koordinatlarına bağlı olan nesnelerdir. Bu nedenle, haritayı sürüklediğinizde veya yakınlaştırdığınızda hareket ederler. Bir haritaya resim yerleştirmek istiyorsanız GroundOverlay nesnesini kullanabilirsiniz.

Diğer yer paylaşımı türleri hakkında bilgi edinmek için Haritada çizim yapma başlıklı makaleyi inceleyin.

Yer paylaşımı ekleme

GroundOverlay sınıfının kurucusu, bir resmin URL'sini ve LatLngBounds değerini parametre olarak belirtir. Görüntü, haritada oluşturulur, belirli sınırlarla kısıtlanır ve haritanın projeksiyonu kullanılarak uyumlu hale getirilir.

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;
Örneği görüntüleyin

Örneği Deneyin

Yer kaplaması kaldırma

Bir yer paylaşımını haritadan kaldırmak için null parametresini göndererek yer paylaşımının setMap() yöntemini çağırın. Bu yöntemin çağrılmasının yer paylaşımını silmediğini unutmayın. Yer paylaşımını haritada kaldırır. Bunun yerine yer paylaşımını silmek istiyorsanız haritadan kaldırmanız ve ardından yer paylaşımını null olarak ayarlamanız gerekir.

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

Örneği görüntüleyin