مقدمة
التركيبات هي كائنات على الخريطة مرتبطة بإحداثيات خطوط الطول/العرض، لذلك تتحرك عند سحب الخريطة أو تكبيرها/تصغيرها. إذا كنت تريد وضع صورة على الخريطة، يمكنك استخدام
كائن 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); }