مقدمة
التراكبات هي كائنات على الخريطة مرتبطة بإحداثيات خطوط الطول/العرض، لذلك تتحرك عند سحب الخريطة أو تكبيرها/تصغيرها. إذا كنت تريد وضع صورة على الخريطة، يمكنك استخدام
الكائن GroundOverlay
.
للحصول على معلومات حول الأنواع الأخرى من التراكبات، يمكنك الاطّلاع على الرسم على الخريطة.
إضافة تراكب أرضي
تحدد دالة إنشاء
GroundOverlay
عنوان URL للصورة
وLatLngBounds
للصورة كمعلَمات. سيتم عرض الصورة على الخريطة مع تقييدها بالحدود المحددة وتطابقها باستخدام إسقاط الخريطة.
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;
تجربة النموذج
إزالة تراكب أرضي
لإزالة طبقة مركّبة من خريطة، عليك استدعاء طريقة setMap()
الخاصة بالتراكب، وذلك بمرور null
. ويُرجى العِلم أنّ طلب هذه الطريقة لا يؤدي إلى حذف العنصر المركّب. يؤدي ذلك إلى إزالة
التركيب من الخريطة. بدلاً من ذلك، إذا أردت حذف المركّبة،
عليك إزالتها من الخريطة ثم ضبط
التراكب نفسه على null
.
function removeOverlay() { historicalOverlay.setMap(null); }