البدء

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

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

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

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

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

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

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

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

1. حمِّل واجهة برمجة التطبيقات JavaScript API في "خرائط Google".

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

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

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