الدعم

تسرد هذه الصفحة المشكلات المعروفة والحلول البديلة لخرائط المتجهات وميزات WebGL.

دعم المتصفّح/الجهاز

تتوافق معاينة ميزة WebGL مع المتصفحات والأجهزة نفسها التي تستخدمها واجهة برمجة تطبيقات JavaScript للخرائط. للتحقّق مما إذا كان المتصفّح على جهاز معيّن سيتوافق مع WebGL، يُرجى الانتقال إلى get.webgl.org أو caniuse.com. يُرجى أيضًا الحرص على يتم تفعيل تسريع الأجهزة في إعدادات المتصفح، بخلاف الخرائط المتجهة سيعود إلى النقطة النقطية.

صورة نقطية أم متجه؟

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

التحقّق من إمكانات المتصفّح على Chrome

لتحديد إمكانات تسريع الأجهزة التي تم تفعيلها في جهاز معين تثبيت Chrome، والانتقال إلى chrome://gpu/، والتأكد تمكين العناصر التالية (باللون الأخضر):

  • "OpenGL: مفعَّل"
  • WebGL: تسريع الأجهزة"
  • WebGL2: تسريع الأجهزة"

(هذه مجرد متطلبات أساسية، ويمكن أن تكون هناك عوامل أخرى دعم التأثير، راجع "الأخطاء المعروفة" below.)

تفعيل ميزة "تسريع الأجهزة"

لدعم خرائط المتجه، يجب تمكين تسريع الأجهزة في معظم المتصفحات. لتفعيل ميزة "تسريع الأجهزة" في Chrome وMicrosoft Edge، افتح الإعدادات، ثم اختيار النظام والتأكُّد من اختيار استخدام تسريع الأجهزة (Use hardware acceleration) عندما يكون متاحًا.

التحقق آليًا من الصورة النقطية أو المتجهة

يمكنك التحقق آليًا لمعرفة ما إذا كانت الخريطة نقطية أو متجهة، من خلال يَتِمُّ الْآنَ الِاتِّصَالْ بِـ 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;
index.ts

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;
index.js

يمكنك أيضًا استخدام سياق عرض 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 في 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 تكتشفها في وتطبيقات الويب.
  • وقت استجابة بدء التشغيل لخرائط المتجهات أسوأ بكثير من وقت الاستجابة في الخرائط النقطية خرائط Google. في هذه الحالة، تكون مقاييس انحدار وقت استجابة بدء التشغيل منخفضة للغاية مفيدة. نريد بشكل عام معرفة ما إذا كان وقت استجابة بدء التشغيل يتراجع الحدود المقبولة.
  • تجربة خرائط المتجهات ليست سلسة كما يمكن أن تكون. إذا قمت بتسجيل عدد اللقطات في الثانية أو بمقاييس التأثر، كيف تقارن هذه الخرائط بين خرائط المتجهات والخرائط النقطية؟
  • يختلف الأداء بشكل كبير حسب المتصفح.

إذا كنت قد أعددت اختبار A/B للمقارنة بين الخرائط المتجهة والخرائط النقطية، يُرجى مشاركة أي ملاحظات حول الأداء تحصل عليها، حيث سيكون ذلك مفيدًا جدًا لمساعدتنا على تحسين الميزة.