تدرج هذه الصفحة المشاكل المعروفة والحلول البديلة لخرائط المتجهات وميزات WebGL.
المتصفّحات والأجهزة المتوافقة
تتوافق معاينة ميزة WebGL مع المتصفّحات والأجهزة نفسها التي تتوافق مع Maps JavaScript API. للتحقّق مما إذا كان المتصفّح على جهاز معيّن سيتوافق مع WebGL، انتقِل إلى get.webgl.org أو caniuse.com. يُرجى أيضًا التأكّد من تفعيل تسريع الأجهزة في إعدادات المتصفّح، وإلا ستعود الخرائط المتجهة إلى الرسومات النقطية.
صور نقطية أو متجهة؟
في بعض الأحيان، قد تعود الخريطة الاتجاهية إلى تنسيق نقطي. وعند حدوث ذلك، لن تتوفّر الميزات التي تعتمد على الخريطة المتجهة. قد يتم الرجوع إلى خريطة نقطية لأسباب مختلفة. يوضّح لك هذا القسم كيفية ضبط متصفّح الويب بشكل صحيح، وكيفية التحقّق آليًا من توفّر إمكانية استخدام الخرائط المتجهة.
التحقّق من إمكانات المتصفّح على Chrome
لتحديد إمكانات تسريع الأجهزة المفعَّلة في عملية تثبيت معيّنة من Chrome، انتقِل إلى chrome://gpu/ وتأكَّد من تفعيل العناصر التالية (باللون الأخضر):
- OpenGL: مفعَّل
- "WebGL: تسريع الأجهزة"
- WebGL2: تسريع الأجهزة
(هذه مجرد متطلبات أساسية، وقد تكون هناك عوامل أخرى تؤثر في التوافق، راجِع "الأخطاء المعروفة" أدناه).
تفعيل ميزة "تسريع الأجهزة"
لاستخدام الخرائط المتجهة، يجب تفعيل خيار "تسريع الأجهزة" في معظم المتصفحات. لتفعيل ميزة "تسريع الأجهزة" في Chrome وMicrosoft Edge، افتح الإعدادات، ثم انقر على النظام، وتأكَّد من تفعيل خيار استخدام ميزة "تسريع الأجهزة" عند توفرها.
- كيفية تغيير الإعدادات المفضّلة للمواقع الإلكترونية في Safari
- مزيد من المعلومات عن إعدادات الأداء في Firefox
التحقّق آليًا من الصور النقطية أو المتجهة
يمكنك التحقّق آليًا مما إذا كانت الخريطة نقطية أو متجهة، وذلك من خلال استدعاء map.getRenderingType()
. يعرض المثال التالي رمزًا برمجيًا لتتبُّع الحدث renderingtype_changed
وعرض نافذة معلومات توضّح ما إذا كان يتم استخدام خريطة نقطية أو متجهة.
TypeScript
/** * This example creates a map with an info window that shows whether * the map render type is raster or vector. */ function initMap() { const center = {lat: 0, lng: 0}; const map = new google.maps.Map(document.getElementById('map') as HTMLElement, { center, zoom: 10, heading: 0.0, tilt: 0.0, // Map ID for a vector map. mapId: '6ff586e93e18149f', }); const canvas = document.createElement("canvas"); const infoWindow = new google.maps.InfoWindow({ content: '', ariaLabel: 'Raster/Vector', position: center, }); infoWindow.open({ map, }); map.addListener('renderingtype_changed', () => { infoWindow.setContent(`${map.getRenderingType()}`); }); } declare global { interface Window { initMap: () => void; } } window.initMap = initMap;
JavaScript
/** * This example creates a map with an info window that shows whether * the map render type is raster or vector. */ function initMap() { const center = { lat: 0, lng: 0 }; const map = new google.maps.Map(document.getElementById("map"), { center, zoom: 10, heading: 0.0, tilt: 0.0, // Map ID for a vector map. mapId: "6ff586e93e18149f", }); const canvas = document.createElement("canvas"); const infoWindow = new google.maps.InfoWindow({ content: "", ariaLabel: "Raster/Vector", position: center, }); infoWindow.open({ map, }); map.addListener("renderingtype_changed", () => { infoWindow.setContent(`${map.getRenderingType()}`); }); } window.initMap = initMap;
يمكنك أيضًا استخدام سياق عرض WebGL للتحقّق من التوافق مع WebGL 2 باتّباع الخطوات التالية:
const canvas = document.createElement("canvas");
canvas.getContext("webgl2") ? console.log("WebGL 2 is supported") : console.log("WebGL 2 is NOT supported");
تعرَّف على طرق أخرى لرصد سياق عرض WebGL آليًا.
التوافق مع الويب على الأجهزة الجوّالة
لا يزال دعم الخرائط المتجهة على الويب على الأجهزة الجوّالة تجريبيًا. يمكن للمطوّرين استخدام واجهات برمجة التطبيقات الخاصة بالعملاء لرصد متصفّحات الويب على الأجهزة الجوّالة واستخدام معرّف خريطة مرتبط بخريطة نقطية بدلاً من خريطة متّجهة. نتوقّع أن يكون أداء العرض أبطأ على بعض الأجهزة الجوّالة. إذا اخترت استخدام الخرائط المتجهة على الويب على الأجهزة الجوّالة، سنقدّر كثيرًا إحصاءات الأداء وملاحظاتك. كما هو موضّح أعلاه، إذا لم تتوفّر ميزة "خرائط متّجهة"، سيتم تلقائيًا استخدام رقم تعريف خريطة نقطية بدلاً من رقم تعريف خريطة متّجهة.
Bugs
الأخطاء المعروفة
- هناك مشكلة معروفة في Chrome على بعض أجهزة macOS التي تتضمّن وحدات معالجة رسومات مدمَجة من نوع AMD. وقد يكون ذلك مربكًا بشكل خاص عندما يبدّل نظام التشغيل macOS ديناميكيًا بين وحدات معالجة الرسومات على الأجهزة التي تتضمّن وحدات معالجة رسومات متعددة، لذا قد لا تتوفّر الخرائط المتجهة حسب التطبيقات الأخرى التي يتم تشغيلها أو ما إذا كانت شاشة خارجية متصلة. يبدو أنّ تفعيل ANGLE Metal backend القادم في Chrome يحلّ هذه المشكلة في بعض الحالات. يمكنك متابعة خطط الطرح العامة لهذه الميزة على الرابط https://bugs.chromium.org/p/chromium/issues/detail?id=1322521.
الإبلاغ عن الأخطاء
- يُرجى تثبيت أحدث إصدار من المتصفّح وبرنامج تشغيل وحدة معالجة الرسومات قبل الإبلاغ عن الخطأ.
- تأكَّد من تفعيل إعداد "تسريع الأجهزة" في
chrome://settings/system
(Chrome) أوabout:preferences#general
(Firefox) أوedge://settings/system
(Microsoft Edge). في Safari، يتم تفعيل هذا الإعداد تلقائيًا في الإصدار 10.15 من نظام التشغيل macOS أو الإصدارات الأحدث. بالنسبة إلى إصدارات MacOS القديمة، يُرجى الانتقال إلى إعدادات Safari المتقدّمة والتأكّد من تفعيل الخيار "استخدام تسريع الأجهزة" (Use hardware acceleration). - أدرِج رابط عيّنة التعليمات البرمجية jsfiddle في تقرير الخطأ.
- يُرجى أيضًا أخذ لقطة شاشة
chrome://gpu
(Chrome) أوabout:support
(Firefox) أوedge://gpu
(Microsoft Edge)، وإرفاق معلومات ذات صلة بوحدة معالجة الرسومات في تقرير الخطأ في حال مواجهة أي مشاكل في العرض.
إطلاعنا على رأيك
نحن نقدّر ملاحظاتك وآراءك ونسعى إلى تقديم أفضل تجربة ممكنة لخريطة المتجهات لك وللمستخدمين النهائيين. يُرجى إعلامنا في حال:
- إذا رصدت أي أخطاء أو مشاكل/تعطُّل جديد في JavaScript في تطبيقاتك على الويب
- يكون وقت استجابة بدء التشغيل لخرائط المتجهات أسوأ بكثير من وقت استجابة بدء التشغيل لخرائط الصور النقطية. في هذه الحالة، تكون مقاييس تراجع وقت استجابة بدء التشغيل مفيدة جدًا. بشكل عام، نريد معرفة ما إذا كان وقت استجابة بدء التشغيل يتراجع إلى ما دون الحدود المقبولة.
- تجربة الخرائط المتجهة ليست سلسة كما ينبغي. في حال تسجيل مقاييس معدّل اللقطات في الثانية أو مقاييس التشويش، كيف تتم مقارنتها بين الخرائط المتجهة والخرائط النقطية؟
- يختلف الأداء بشكل كبير حسب المتصفّح.
إذا كنت قد أعددت اختبار A/B لمقارنة الخرائط المتجهة بالخرائط النقطية، يُرجى مشاركة أي ملاحظات حول الأداء تحصل عليها، لأنّ ذلك سيكون مفيدًا جدًا لمساعدتنا في تحسين الميزة.