البدء

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

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

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

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

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

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

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

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

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 للاشتراك في التغييرات المتعلّقة بإمكانية استخدام الخريطة. إنّ استخدام إمكانات "خرائط Google" اختياري، ولا يُنصح به إلا لأغراض الاختبار وتحديد المشاكل وحلّها، أو لأغراض الحلول الاحتياطية في وقت التشغيل.

// 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.
  }
});

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

إنشاء علامة متقدّمة تلقائية