البدء

اتّبِع الخطوات التالية لإعداد العلامات المتقدّمة.

الحصول على مفتاح واجهة برمجة تطبيقات وتفعيل Maps JavaScript API

قبل استخدام العلامات المتقدّمة، يجب أن يكون لديك مشروع على Cloud يتضمّن حساب فوترة، ويجب تفعيل Maps JavaScript API. لمزيد من المعلومات، يُرجى الاطّلاع على إعداد مشروعك على Google Cloud.

الحصول على مفتاح واجهة برمجة تطبيقات

إنشاء معرّف خريطة

لإنشاء معرّف خريطة جديد، اتّبِع الخطوات الواردة في مقالة التخصيص على السحابة الإلكترونية. اضبط "نوع الخريطة" على JavaScript، ثم اختَر إما متجه أو صورة نقطية.

تعديل رمز تهيئة الخريطة

يتطلّب ذلك إدخال رقم تعريف الخريطة الذي أنشأته للتو. يمكنك العثور عليه في صفحة إدارة الخرائط.

1. تحميل Maps JavaScript API

2. حمِّل مكتبة "العلامات المتقدّمة" من داخل دالة async عند الحاجة:

   const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;

3. قدِّم معرّف خريطة عند إنشاء الخريطة باستخدام السمة mapId. يمكن أن يكون هذا معرّف خريطة تقدّمه أنت أو DEMO_MAP_ID.

   const map = new
   google.maps.Map(document.getElementById('map'), {
     center: {lat: -34.397, lng: 150.644},
     zoom: 8,
     mapId: 'YOUR_MAP_ID'
   });

التحقّق من إمكانات الخريطة (اختياري)

تتطلّب "محدّدات المواقع المتقدّمة" رقم تعريف خريطة. في حال عدم توفّر رقم تعريف الخريطة، لا يمكن تحميل محدّدات المواقع المتقدّمة. كخطوة لتحديد المشاكل وحلّها، يمكنك إضافة أداة معالجة mapcapabilities_changed للاشتراك في التغييرات التي تطرأ على إمكانات الخريطة. استخدام "إمكانات الخرائط" هو أمر اختياري، ولا يُنصح به إلا لأغراض الاختبار وتحديد المشاكل وحلّها، أو لأغراض التراجع عن وقت التشغيل.

// Optional: subscribe to map capability changes.
map.addListener('mapcapabilities_changed', () => {
  const mapCapabilities = map.getMapCapabilities();

  if (!mapCapabilities.isAdvancedMarkersAvailable) {
    // Advanced markers are *not* available, add a fallback.
  }
});

الخطوات التالية

إضافة علامة إلى خريطة