تخصيص الخرائط الثلاثية الأبعاد

يمكنك تخصيص مظهر الخريطة الأساسية الثلاثية الأبعاد باستخدام ميزة "تصميم الخرائط باستخدام السحابة الإلكترونية".

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

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

يعرض المثال التالي خريطة تستخدم نمطًا مخصّصًا لتغيير لون رموز ميزة الاستجمام والنص إلى اللون البرتقالي:

async function init() {
    const { Map3DElement } = await google.maps.importLibrary('maps3d');

    const map = new Map3DElement({
        center: {
            lat: 37.75183154601466,
            lng: -119.52369070507672,
            altitude: 2200,
        },
        tilt: 67.5,
        heading: 108.94057782079429,
        range: 6605.57279990986,
        mapId: 'bcce776b92de1336e22c569f', // Styles are associated with map IDs.
        mode: 'HYBRID',
    });

    document.body.append(map);
}

void init();

نظرة عامة

تتشابه عملية تخصيص الخرائط الثلاثية الأبعاد باستخدام ميزة "تصميم الخرائط باستخدام السحابة الإلكترونية" مع عملية تخصيص الخرائط الثنائية الأبعاد، وهي:

1 إنشاء معرّف خريطة أنشئ معرّف خريطة. يتم تمرير معرّفات الخرائط إلى تطبيقك للتعامل مع الأنماط. ستربط نمطًا مخصّصًا بمعرّف الخريطة هذا في الخطوات اللاحقة.
2 إنشاء نمط خريطة مستند إلى السحابة الإلكترونية يجب اختيار "ثلاثي الأبعاد المختلط" واستخدام "الوضع الفاتح" في هذه الخطوة.
3 ربط نمط الخريطة بخريطة ربط نمطك بمعرّف الخريطة الذي أنشأته في الخطوة الأولى
4 إضافة معرّف الخريطة إلى تطبيقك حدِّد معرّف الخريطة في الرمز باستخدام المَعلمة map-id.
5 نشر معرّف الخريطة يُرجى العِلم أنّ التغييرات التي يتم إجراؤها على النمط المخصّص يتم دمجها تلقائيًا في تطبيقك بعد النشر.

لإلقاء نظرة متعمّقة على إنشاء أنماط الخرائط، راجِع إنشاء أنماط الخرائط واستخدامها.

تعديل رقم تعريف الخريطة بشكل ديناميكي

يمكنك تعديل السمة mapId بشكل ديناميكي بعد إنشاء مثيل للخريطة. يتيح لك ذلك تطبيق نمط خريطة مختلف مستند إلى السحابة الإلكترونية بدون الحاجة إلى إعادة إنشاء مثيل Map3DElement بأكمله.

لتعديل معرّف الخريطة، اضبط السمة mapId على العنصر Map3DElement:

const map3DElement = document.querySelector('gmp-map-3d');

// Update the map ID dynamically
map3DElement.mapId = 'YOUR_MAP_ID';

بما أنّ السمة mapId تعكس سمة HTML، يمكنك أيضًا تعديلها ديناميكيًا من خلال تعديل السمة:

const map3DElement = document.querySelector('gmp-map-3d');

// Alternatively, set the map-id attribute
map3DElement.setAttribute('map-id', 'YOUR_MAP_ID');

القيود

هناك بعض القيود التي يجب الانتباه إليها عند استخدام ميزة "تصميم الخرائط باستخدام السحابة الإلكترونية" مع "خرائط ثلاثية الأبعاد" في Maps JavaScript:

  • لا يتوفّر "الوضع الداكن".
  • لا تتوفّر الميزات التي تتطلّب معرّف الخريطة، مثل التنسيق المستند إلى البيانات.