Переклад цієї статті ще триває.
WebGL (Web Graphics Library) - це JavaScript API для відображення інтерактивної 3D та 2D графіки в будь-якому сумісному веб-переглядачі без використання плагінів. WebGL робиць це вводячи API, яке точно відповідає OpenGL ES 2.0 та може бути використане в HTML5 <canvas> елементах.
Підтримка WebGL присутня в Firefox 4+, Google Chrome 9+, Opera 12+, Safari 5.1+ and Internet Explorer 11+; проте, користувацький пристрій має також мати апаратне забезпечення, яке підтримує ці функції.
Елемент <canvas> також використовується Canvas 2D для побудови 2D графіки на веб-сторінках.
Посилання
Стандартні інтерфейси
Розширення
ANGLE_instanced_arraysEXT_blend_minmaxEXT_color_buffer_floatEXT_color_buffer_half_floatEXT_disjoint_timer_queryEXT_frag_depthEXT_sRGBEXT_shader_texture_lodEXT_texture_filter_anisotropicOES_element_index_uintOES_standard_derivativesOES_texture_floatOES_texture_float_linearOES_texture_half_floatOES_texture_half_float_linearOES_vertex_array_objectWEBGL_color_buffer_floatWEBGL_compressed_texture_atcWEBGL_compressed_texture_es3WEBGL_compressed_texture_etc1WEBGL_compressed_texture_pvrtcWEBGL_compressed_texture_s3tcWEBGL_debug_renderer_infoWEBGL_debug_shadersWEBGL_depth_textureWEBGL_draw_buffersWEBGL_lose_context
Події
Константи і типи
Керівництва і навчальні сторінки
- Керівництво по WebGL: Основні поняття WebGL для початківця. Гарний початок, якщо ви не маєте досвіду роботи з WebGL.
- Кращі практики WebGL: Підказки та поради для покращення контенту WebGL.
- Використання розширень: Як використовувати доступні для WebGL розширення.
Детальні керівництва
- WebGL model view projection: Детальне пояснення трьох основних матриць, які переважно використовуються для представлення 3D виду об'єкту: матриця моделі, виду та проекції.
- Matrix math for the web: Корисне керівництво про те, як працюють матриці 3D перетворення, та як вони можуть бути використані в web - як для розрахунків WebGL, так і для CSS3 перетворень .
Ресурси
- Raw WebGL: An introduction to WebGL Розмова Ніка Дізолнірс який знайомить з основами WebGL. Це відмінне місце, щоб почати, якщо ви ніколи не займались низькорівневим програмуванням графіки.
- Khronos WebGL site Основний веб-сайт WebGL на Khronos Group.
- Learning WebGL Сайт з керівництвами про використання WebGL.
- WebGL Fundamentals Базове керівництво про основи WebGL.
- WebGL playground An online tool for creating and sharing WebGL projects. Good for quick prototyping and experimenting.
- WebGL Academy Редактор HTML/JavaScript з керівництвами для вивчення основ програмування під WebGL.
- WebGL Stats Сайт зі статистикою про можливості WebGL в веб-переглядачах на різних платформах.
Бібліотеки
- glMatrix JavaScript-бібліотека матриці і вектору для WebGL додатків з високою ефективністю.
- Sylvester Бібліотека з відкритим початковим кодом для маніпулювання векторами і матрицями. Не оптимізована для WebGL але надзвичайно міцна.
Специфікації
| Специфікація | Статус | Коментар |
|---|---|---|
| WebGL 1.0 | Recommendation | Початкове визначення. Базується на OpenGL ES 2.0 |
| WebGL 2.0 | Editor's Draft | Будується поверх WebGL1. На основі OpenGL ES 3.0. |
| OpenGL ES 2.0 | Standard | |
| OpenGL ES 3.0 | Standard |
Сумісність
| Функція | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Базова підтримка | 4.0 (2.0) | 9 | 11 | 12[1] | 5.1[1] |
| Функція | Firefox Mobile (Gecko) | Chrome for Android | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Базова підтримка | 4 | 25[1] | No support | 12[1] | 8.1 |
[1] Реалізація цієї функції є експериментальною.
Зауваження по сумісності
На додаток до веб-переглядача, сам графічний процесор також має підтримувати цю функцію. Так, наприклад, стиснення текстур S3 (S3TC) доступне тільки для планшетів на основі Tegra . Більшість браузерів роблять контекст WebGL доступним через контекстне ім'я webgl, але старішим також потрібно experimental-webgl. Крім того, майбутній WebGL 2 повністю сумісний і матиме ім'я контексту webgl2.
Зауваження Gecko
Налагодження і тестування WebGL
Починаючи з Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7), є дві доступні опції, які дозволяють контролювати можливості WebGL з метою тестування:
webgl.min_capability_mode- Властивість типу Boolean яка, коли
true, вмикає режим мінімальної сумісності. Коли WebGL знаходиться в даному режимі, він налаштований підтримувати тільки мінімальний набір функцій і можливостей, необхідних специфікації WebGL. Це дозволяє вам бути впевненими, що важ WebGL код буде працювати на будь-якому пристрої або веб-переглядачі, незалежно від інших можливостей. Має значенняfalseза замовчування. webgl.disable_extensions- Властивість типу Boolean яка, коли
true, вимикає всі розширення WebGL. Має значенняfalseза замовчуванням.