حزمة أدوات Places UI Kit: هي مكتبة جاهزة للاستخدام تتيح للمطوّرين إمكانية التخصيص والتحكّم. ننصحك بتجربتها ومشاركة ملاحظاتك حول تجربتك مع حزمة واجهة المستخدم.

Google uses AI technology to translate content into your preferred language. AI translations can contain errors.

نظرة عامة

تتيح لك الميزات المستندة إلى WebGL في Maps JavaScript API التحكّم في الإمالة والتدوير، وإضافة كائنات ثلاثية الأبعاد مباشرةً إلى الخريطة، وغير ذلك. في ما يلي الميزات المضمّنة:

العرض المركّب باستخدام WebGL يتيح لك إضافة رسومات مخصّصة ثنائية وثلاثية الأبعاد ومحتوى متحرك إلى خرائطك.
يمكنك الآن تعديل الإمالة والاتجاه آليًا، وباستخدام إيماءات الماوس ولوحة المفاتيح
map.moveCamera() تتيح لك الدالة تغيير خصائص الكاميرا المتعدّدة في آنٍ واحد.
تتيح ميزة التكبير الآن استخدام القيم الكسرية.

البدء

لاستخدام ميزات WebGL الجديدة، يجب استخدام خريطة متجهة. يوضّح لك هذا القسم كيفية إجراء ذلك.

تحديد خيار `renderingType`

استخدِم خيار renderingType لتحديد نوع العرض النقطي أو المتّجه لخريطتك (لا يلزم استخدام رقم تعريف خريطة):

حمِّل مكتبة RenderingType. يمكنك إجراء ذلك عند تحميل مكتبة "خرائط Google":
```
const { Map, RenderingType } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
```

عند تهيئة الخريطة، استخدِم خيار renderingType لتحديد RenderingType.VECTOR أو RenderingType.RASTER:

map = new Map(
  document.getElementById('map') as HTMLElement,
  {
    zoom: 4,
    center: position,
    renderingType: RenderingType.VECTOR,
  }
);

يلغي خيار renderingType أي إعدادات لنوع العرض تم إجراؤها من خلال ضبط رقم تعريف خريطة.

لتفعيل الإمالة والتدوير، اضبط خيار الخريطة tiltInteractionEnabled على "صحيح" أو استخدِم الدالة map.setTiltInteractionEnabled.
لتفعيل التحريك، اضبط خيار الخريطة headingInteractionEnabled على true أو استخدِم الدالة map.setHeadingInteractionEnabled.

استخدام رقم تعريف خريطة لضبط نوع العرض

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

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

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

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

استخدام العنصر `<gmp-map>`

يتم تفعيل الخرائط المتجهة والإمالة والاتجاه تلقائيًا عند استخدام العنصر <gmp-map> ، الذي يتيح لك إضافة خريطة إلى صفحتك باستخدام HTML. مزيد من المعلومات.

أمثلة

تم تقديم أمثلة لتوضيح هذه الميزات: