تراكبات الأرض

1. المقدمة
2. إضافة طبقة مركّبة على الأرض
3. إزالة طبقة مركّبة على الأرض

المقدمة

التراكبات هي عناصر على الخريطة مرتبطة بإحداثيات خطوط الطول والعرض، لذا تتحرك عند سحب الخريطة أو تكبيرها/تصغيرها. إذا كنت تريد وضع صورة على خريطة، يمكنك استخدام عنصر GroundOverlay.

للحصول على معلومات عن الأنواع الأخرى من التراكبات، راجِع الرسم على الخريطة.

إضافة تراكب على الأرض

تحدّد أداة إنشاء GroundOverlay عنوان URL لصورة وLatLngBounds للصورة كمعلّمات. سيتم عرض الصورة على الخريطة، مقيّدة بالحدود المعيّنة، وستتم تعديلها باستخدام إسقاط الخريطة.

// 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

// 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

إزالة تراكب الأرض

لإزالة تراكب من الخريطة، اطلب طريقة setMap() المركّبة مع تمرير null. يُرجى العِلم أنّ استدعاء هذه الطريقة لا يؤدي إلى حذف التراكب. ويؤدي ذلك إلى إزالة التراكب من الخريطة. إذا كنت تريد بدلاً من ذلك حذف التراكب، يجب إزالته من الخريطة ثم ضبط التراكب نفسه على null.

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

عرض مثال