این صفحه مشکلات شناختهشده و راهحلهای موقت برای نقشههای بُرداری و ویژگیهای WebGL را فهرست میکند.
پشتیبانی از مرورگر/دستگاه
پیشنمایش ویژگی WebGL از همان مرورگرها و دستگاههایی پشتیبانی میکند که Maps JavaScript API پشتیبانی میکند. برای بررسی اینکه آیا مرورگر در دستگاه خاصی از WebGL پشتیبانی میکند یا نه، به get.webgl.org یا caniuse.com مراجعه کنید. لطفاً همچنین مطمئن شوید که شتاب سختافزاری در تنظیمات مرورگر فعال باشد، درغیراینصورت نقشههای بُرداری به شطرنجی برمیگردند.
شطرنجی یا برداری؟
گاهی اوقات، نقشه بُرداری ممکن است به شطرنجی برگردد. وقتی این اتفاق میافتد، ویژگیهای وابسته به نقشه بُرداری دردسترس نیستند. بازگشت به نقشه شطرنجی ممکن است به دلایل مختلفی رخ دهد. این بخش نشان میدهد چگونه مرورگر وب خود را بهدرستی پیکربندی کنید و چگونه بهصورت برنامهریزیشده بررسی کنید که آیا قابلیت نقشه برداری وجود دارد یا خیر.
بررسی قابلیتهای مرورگر در Chrome
برای تعیین اینکه کدام قابلیتهای شتاب سختافزاری در نصب خاصی از Chrome فعال هستند، به chrome://gpu/ بروید و مطمئن شوید که موارد زیر فعال هستند (به رنگ سبز):
- «OpenGL: فعال»
- «WebGL: Hardware accelerated»
- «WebGL2: Hardware accelerated» (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 آشنا شوید.
پشتیبانی وب تلفن همراه
پشتیبانی وب تلفن همراه از نقشههای بُرداری هنوز در مرحله آزمایشی است. توسعهدهندگان میتوانند از میاناهای برنامهسازی کاربردی کارخواه برای شناسایی مرورگرهای وب تلفن همراه استفاده کنند و بهجای نقشه بُرداری از شناسه نقشه مرتبط با نقشه شطرنجی استفاده کنند. پیشبینی میکنیم عملکرد پرداز برای برخیاز دستگاههای همراه کندتر شود. اگر تصمیم بگیرید از نقشههای بُرداری در وب تلفن همراه استفاده کنید، از آمار عملکرد و بازخورد شما بسیار سپاسگزار خواهیم بود. همانطور که در بالا گفته شد، اگر پشتیبانی از «نقشههای برداری» دردسترس نباشد، شناسه نقشه برداری بهطور خودکار به استفاده از نقشه شطرنجی برمیگردد.
اشکالات
اشکالات شناختهشده
- مشکل شناختهشدهای در Chrome در برخیاز دستگاههای macOS با GPUهای AMD وجود دارد. این موضوع میتواند بهویژه زمانی گیجکننده باشد که macOS بهصورت پویا بین واحدهای پردازش گرافیکی در دستگاههای دارای چند واحد پردازش گرافیکی جابهجا میشود، بنابراین نقشههای برداری ممکن است بسته به اینکه چه برنامههای دیگری درحال اجرا هستند یا اینکه آیا مانیتور خارجی متصل است یا نه، دردسترس نباشند. بهنظر میرسد روشن کردن ANGLE Metal backend آینده Chrome این مشکل را در برخی موارد برطرف میکند. میتوانید طرحهای کلی عرضه عمومی را در https://bugs.chromium.org/p/chromium/issues/detail?id=1322521 دنبال کنید.
درحال گزارش کردن اشکالها
- لطفاً قبلاز گزارش کردن اشکال، مرورگر و درایور GPU را به جدیدترین نسخه بهروز کنید.
- مطمئن شوید تنظیم شتاب سختافزاری در
chrome://settings/system(Chrome)،about:preferences#general(Firefox)،edge://settings/system(Microsoft Edge) فعال باشد. در Safari، این تنظیم بهطور خودکار در macOS نسخه ۱۰.۱۵ یا جدیدتر فعال میشود. برای نسخههای قدیمیتر MacOS، لطفاً به تنظیمات پیشرفته Safari بروید و مطمئن شوید که گزینه «استفاده از شتاب سختافزاری» فعال باشد. - پیوند کد نمونه jsfiddle را در گزارش اشکال اضافه کنید.
- لطفاً از
chrome://gpu(Chrome)،about:support(Firefox)، یاedge://gpu(Microsoft Edge) نماگرفت بگیرید و درصورت مواجهه با هرگونه مشکل پردازشی، اطلاعات مربوط به GPU را به گزارش اشکال پیوست کنید.
به ما بگویید چه فکر میکنید!
برای بازخورد شما ارزش قائلیم زیرا تلاش میکنیم بهترین تجربه نقشه برداری برداری را برای شما و کاربران نهاییتان فراهم کنیم. لطفاً در موارد زیر به ما اطلاع دهید:
- خطاهای جدید JavaScript یا اشکالات/خرابیهایی که در برنامههای وب خود شناسایی میکنید.
- تأخیر راهاندازی برای نقشههای بُرداری بهطور قابلتوجهی بدتر از نقشههای شطرنجی است. در این شرایط، سنجههای مربوط به پسرفت تأخیر راهاندازی بسیار مفید هستند. بهطورکلی، میخواهیم بدانیم آیا تأخیر راهاندازی از آستانههای قابلقبول فراتر میرود یا نه.
- تجربه نقشههای برداری آنطور که باید روان نیست. اگر FPS یا سنجههای jank را ثبت میکنید، این سنجهها در نقشههای برداری و شطرنجی چه تفاوتی با هم دارند؟
- عملکرد بسته به مرورگر بسیار متفاوت است.
اگر آزمایش A/B را برای مقایسه نقشههای بُرداری با نقشههای شطرنجی راهاندازی کردهاید، لطفاً هرگونه بازخورد عملکردی را که دریافت میکنید همرسانی کنید، زیرا این بازخوردها برای کمک به ما در بهبود این ویژگی بسیار مفید خواهد بود.