✖


Jump to content

ВебГЛ

ВебГЛ
Оригинальный автор(ы) Фонд Мозиллы
Разработчик(и) Рабочая группа Khronos WebGL
Первоначальный выпуск 3 марта 2011 г .; 13 лет назад ( 03.03.2011 ) [1]
Стабильная версия
2.0 / 17 января 2017 г .; 7 лет назад ( 17.01.2017 )
Платформа Кросс-платформенный
Тип API
Веб-сайт www .chronos .org /вебгл /
HTML
Сравнения

WebGL (сокращение от Web Graphics Library ) — это JavaScript API для рендеринга интерактивной 2D- и 3D-графики в любом совместимом веб-браузере без использования подключаемых модулей . [2] WebGL полностью интегрирован с другими веб-стандартами , что позволяет с помощью графического процессора использовать физику, обработку изображений и эффекты на HTML холсте . Элементы WebGL можно смешивать с другими элементами HTML и объединять с другими частями страницы или фона страницы. [3]

Программы WebGL состоят из управляющего кода, написанного на JavaScript, и кода шейдера , написанного на языке шейдинга OpenGL ES (GLSL ES), языке, похожем на C или C++ . Код WebGL выполняется на графическом процессоре компьютера.

WebGL разработан и поддерживается некоммерческой организацией Khronos Group . [4] 9 февраля 2022 года Khronos Group объявила о поддержке WebGL 2.0 во всех основных браузерах. [5]

Дизайн

[ редактировать ]

WebGL 1.0 основан на OpenGL ES 2.0 и предоставляет API для 3D-графики. [6] Он использует HTML5 элемент холста , а доступ к нему осуществляется с помощью интерфейсов объектной модели документа (DOM).

WebGL 2.0 основан на OpenGL ES 3.0 . Он гарантирует доступность множества дополнительных расширений WebGL 1.0 и предоставляет новые API. [7] Автоматическое управление памятью неявно обеспечивается JavaScript . [4]

Как и OpenGL ES 2.0, в WebGL отсутствуют API-интерфейсы с фиксированными функциями, представленные в OpenGL 1.0 и устаревшие в OpenGL 3.0. Эта функциональность, если требуется, должна быть реализована разработчиком с использованием кода шейдера и JavaScript.

Шейдеры в WebGL написаны на GLSL и передаются в API WebGL в виде текстовых строк. Реализация WebGL компилирует эти строки в код графического процессора. Этот код выполняется для каждой вершины, отправленной через API, и для каждого пикселя, растрированного на экране.

История

[ редактировать ]

WebGL развился из экспериментов Canvas 3D, начатых Владимиром Вукичевичем из Mozilla . Вукичевич впервые продемонстрировал прототип Canvas 3D в 2006 году. К концу 2007 года обе Mozilla [8] и Опера [9] сделали свои собственные отдельные реализации.

В начале 2009 года некоммерческий технологический консорциум Khronos Group основал рабочую группу WebGL с первоначальным участием Apple , Google , Mozilla, Opera и других. [4] [10] Версия 1.0 спецификации WebGL была выпущена в марте 2011 года. [1]

Ранним применением WebGL было Zygote Body . [11] [12] В ноябре 2012 года Autodesk объявила, что перенесла большинство своих приложений в облако, работающее на локальных клиентах WebGL. В число этих приложений вошли Fusion 360 и AutoCAD 360. [13]

Разработка спецификации WebGL 2 началась в 2013 году и завершилась в январе 2017 года. [14] Спецификация основана на OpenGL ES 3.0. [15] Первые реализации есть в Firefox 51, Chrome 56 и Opera 43. [16]

Реализации

[ редактировать ]

Почти родной графический движок

[ редактировать ]
Основная статья: ANGLE (программное обеспечение)

Почти Native Graphics Layer Engine (ANGLE) — это графический движок с открытым исходным кодом, реализующий стандарты WebGL 1.0 (2.0, который близко соответствует ES 3.0) и OpenGL ES 2.0 и 3.0. Это серверная часть по умолчанию для Google Chrome и Mozilla Firefox на платформах Windows, которая работает путем перевода вызовов WebGL и OpenGL в доступные API-интерфейсы для конкретной платформы. В настоящее время ANGLE предоставляет доступ к OpenGL ES 2.0 и 3.0 к API-интерфейсам OpenGL, OpenGL ES, Direct3D 9 и Direct3D 11 для настольных компьютеров. [17] ″[Google] Chrome использует ANGLE для рендеринга всей графики в Windows, включая ускоренную реализацию Canvas2D и среду песочницы Native Client.″ [17]

Программное обеспечение

[ редактировать ]

WebGL широко поддерживается современными браузерами. Однако его доступность зависит и от других факторов, например, поддерживает ли его графический процессор. Официальный сайт WebGL предлагает простую тестовую страницу. [18] Более подробную информацию (например, какой рендерер использует браузер и какие расширения доступны) можно найти на сторонних веб-сайтах. [19] [20]

Настольные браузеры [2]

[ редактировать ]
  • Google Chrome — WebGL 1.0 включен на всех платформах, имеющих действующую видеокарту с обновленными драйверами, начиная с версии 9, выпущенной в феврале 2011 года. [21] [22] По умолчанию в Windows Chrome использует механизм рендеринга ANGLE (Almost Native Graphics Layer Engine) для преобразования OpenGL ES в Direct X 9.0c или 11.0, которые имеют лучшую поддержку драйверов. [23] Однако в Linux и Mac OS X средством рендеринга по умолчанию является OpenGL. [24] Также возможно принудительно использовать OpenGL в качестве средства рендеринга в Windows. [23] С сентября 2013 года в Chrome также используется новый модуль рендеринга Direct3D 11, для которого требуется более новая видеокарта. [25] [26] Chrome 56+ поддерживает WebGL 2.0.
  • Firefox — WebGL 1.0 включен на всех платформах, имеющих действующую видеокарту с обновленными драйверами, начиная с версии 4.0. [27] С 2013 года Firefox также использует DirectX на платформе Windows через ANGLE . [23] Firefox 51+ поддерживает WebGL 2.0.
  • Safari — в Safari 6.0 и более поздних версиях, установленных в OS X Mountain Lion , Mac OS X Lion и Safari 5.1 в Mac OS X Snow Leopard, реализована поддержка WebGL 1.0, которая была отключена по умолчанию до Safari 8.0. [28] [29] [30] [31] [32] Safari версии 12 (доступен в MacOS Mojave) имеет доступную поддержку WebGL 2.0 в качестве «экспериментальной» функции. Safari 15 поддерживает WebGL 2.0 для всех пользователей. [33]
  • Opera — WebGL 1.0 был реализован в Opera 11 и 12, но был отключен по умолчанию в 2014 году. [34] [35] Opera 43+ поддерживает WebGL 2.0.
  • Internet Explorer — WebGL 1.0 частично поддерживается в Internet Explorer 11 . [36] [37] [38] [39] Internet Explorer изначально не прошел большинство официальных тестов на соответствие WebGL, но позже Microsoft выпустила несколько обновлений. Последний движок WebGL 0.94 в настоящее время проходит около 97% тестов Khronos. [40] Поддержка WebGL также может быть добавлена ​​вручную в более ранние версии Internet Explorer с помощью сторонних плагинов, таких как IEWebGL. [41]
  • Microsoft Edge — для Microsoft Edge Legacy первоначальная стабильная версия поддерживает WebGL версии 0.95 (контекстное имя: «experimental-webgl») с GLSL в HLSL транспилятором с открытым исходным кодом . [42] Версия 10240+ поддерживает префикс WebGL 1.0. Последняя версия Edge на базе Chromium поддерживает WebGL 2.0.

Мобильные браузеры

[ редактировать ]
  • Браузер Android — WebGL 1.0 поддерживается на Android, начиная с Chrome 25. [43] WebGL 2.0 поддерживается на Android, начиная с Chrome 114. [44] Начиная с Android 5, Chrome используется для веб-просмотра системы Android. [44]
  • BlackBerry 10 – WebGL 1.0 доступен для устройств BlackBerry начиная с версии ОС 10.00. [45]
  • BlackBerry PlayBook – WebGL 1.0 доступен через WebWorks и браузер в PlayBook OS 2.00. [46]
  • Internet Explorer — версия WebGL с префиксом 1.0 доступна на Windows Phone 8.x (11+).
  • Firefox для мобильных устройств — WebGL 1.0 доступен для устройств Android и MeeGo, начиная с Firefox 4. [47] [48]
  • ОС Firefox [48]
  • Google Chrome – WebGL 1.0 доступен для устройств Android, начиная с Google Chrome 25, и включен по умолчанию, начиная с версии 30. [49]
  • Maemo – в Nokia N900 WebGL 1.0 доступен в стандартном браузере microB, начиная с обновления прошивки PR1.2. [50]
  • MeeGo — WebGL 1.0 не поддерживается стандартным браузером Web. Однако он доступен через Firefox . [48]
  • Microsoft Edge — префикс WebGL 1.0 доступен в Windows 10 Mobile. [51]
  • Opera Mobile – Opera Mobile 12 поддерживает WebGL 1.0 (только на Android). [52]
  • Safari на iOS — WebGL 1.0 доступен для мобильного Safari в iOS 8 . [53] WebGL 2.0 доступен для мобильного Safari в iOS 15. [44]
  • ОС Sailfish — WebGL 1.0 поддерживается в браузере Sailfish по умолчанию. [54]
  • Tizen — поддерживается WebGL 1.0. [55]

Инструменты и экосистема

[ редактировать ]

Утилиты

[ редактировать ]

Низкоуровневый характер API WebGL, который сам по себе мало что дает для быстрого создания желаемой трехмерной графики, побудил к созданию библиотек более высокого уровня, которые абстрагируют общие операции (например, загрузка графов сцен и трехмерных объектов в определенных форматах; применение линейных преобразований) . для шейдеров или просмотра усеченных пирамид ). Некоторые такие библиотеки были портированы на JavaScript с других языков. Примеры библиотек, предоставляющих функции высокого уровня, включают A-Frame (VR) , BabylonJS , PlayCanvas , Three.js , OSG.JS , Google средство просмотра моделей и CopperLicht . Web3D также создал проект под названием X3DOM, позволяющий запускать контент X3D и VRML на WebGL.

Игры

[ редактировать ]

Появились 2D- и 3D- игровые движки для WebGL. [56] такие как Unreal Engine 4 и Unity . [57] Библиотека на основе Stage3D /Flash высокого уровня Away3D также имеет порт на WebGL через TypeScript . [25] [58] Более легкая библиотека утилит, которая предоставляет только утилиты векторной и матричной математики для шейдеров, — это sylvester.js. [59] [60] Иногда он используется в сочетании со специальным расширением WebGL, называемым glUtils.js. [59] [61]

Существуют также некоторые 2D-библиотеки, построенные на основе WebGL, такие как Cocos2d -x или Pixi.js , которые были реализованы таким образом из соображений производительности, что аналогично тому, что произошло с Starling Framework вместо Stage3D в мире Flash. 2D-библиотеки на основе WebGL возвращаются к холсту HTML5, когда WebGL недоступен. [62] Устранение узкого места рендеринга путем предоставления почти прямого доступа к графическому процессору выявило ограничения производительности в реализациях JavaScript. Некоторые из них были решены с помощью asm.js и WebAssembly (аналогично появление Stage3D выявило проблемы с производительностью в ActionScript , которые решались такими проектами, как CrossBridge ). [62]

Создание контента

[ редактировать ]

Как и в случае с любым другим графическим API, создание контента для сцен WebGL требует использования инструмента создания 3D-контента и экспорта сцены в формат, читаемый средством просмотра или вспомогательной библиотекой. настольное программное обеспечение для разработки 3D-изображений, такое как Blender , Autodesk Maya или SimLab Composer Для этой цели можно использовать . В частности, Blend4Web позволяет полностью создавать сцену WebGL в Blender и экспортировать ее в браузер одним щелчком мыши, даже в виде отдельной веб-страницы. [63] Существует также некоторое программное обеспечение, специфичное для WebGL, такое как CopperCube и онлайн-редактор Clara.io на основе WebGL . Онлайн-платформы, такие как Sketchfab и Clara.io, позволяют пользователям напрямую загружать свои 3D-модели и отображать их с помощью размещенного средства просмотра WebGL.

Инструменты, основанные на окружающей среде

[ редактировать ]

Начиная с Firefox версии 27, Mozilla предоставляет Firefox встроенные инструменты WebGL, которые позволяют редактировать вершины и фрагментные шейдеры. [64] ряд других инструментов отладки и профилирования . Также появился [65]

См. также

[ редактировать ]

Ссылки

[ редактировать ]
  1. ^ Jump up to: а б «Хронос выпускает окончательную спецификацию WebGL 1.0» . 3 марта 2011 года . Проверено 18 мая 2015 г.
  2. ^ Jump up to: а б «Основы WebGL» . HTML5-рок.
  3. ^ Паризи, Тони (15 августа 2012 г.). «WebGL: все в порядке» . О'Рейли Медиа, Инкорпорейтед. Архивировано из оригинала 1 февраля 2013 г. Проверено 13 июля 2012 г.
  4. ^ Jump up to: а б с «WebGL – OpenGL ES 2.0 для Интернета» . Хронос.орг . Проверено 14 мая 2011 г.
  5. ^ «WebGL 2.0 обеспечивает повсеместную поддержку всех основных веб-браузеров» . Группа «Хронос» . 09.02.2022 . Проверено 13 февраля 2022 г.
  6. ^ «Спецификация WebGL» . Хронос.орг . Проверено 14 мая 2011 г.
  7. ^ «Спецификация WebGL 2.0» . Хронос.орг . Проверено 27 февраля 2017 г.
  8. ^ «Canvas 3D: мощь GL, веб-стиль» . Блог.vlad1.com. Архивировано из оригинала 17 июля 2011 г. Проверено 14 мая 2011 г.
  9. ^ «Перенос холста в другое измерение» . Мой.opera.com. 26 ноября 2007 г. Архивировано из оригинала 17 ноября 2007 г. Проверено 14 мая 2011 г.
  10. ^ «Хронос подробно описывает инициативу WebGL по внедрению в Интернет 3D-графики с аппаратным ускорением» . Хронос.орг. 04 августа 2009 г. Архивировано из оригинала 19 апреля 2012 г. Проверено 14 мая 2011 г.
  11. ^ «Тело Google – Лаборатории Google» . Bodybrowser.googlelabs.com. Архивировано из оригинала 13 мая 2011 г. Проверено 14 мая 2011 г.
  12. ^ Бхану, Синдия Н. (23 декабря 2010 г.). «Новинка от Google: Браузер тела» . Well.blogs.nytimes.com . Проверено 14 мая 2011 г.
  13. ^ «AUTODESK FUSION 360: БУДУЩЕЕ САПР, ЧАСТЬ 1» . 3dcadworld.com . Проверено 21 августа 2013 г.
  14. ^ «Спецификация WebGL 2» . khronos.org. 26 сентября 2013 г. Проверено 28 октября 2013 г.
  15. ^ «Спецификация WebGL 2.0» .
  16. ^ «WebGL — Веб-API» . МДН .
  17. ^ Jump up to: а б «ANGLE — почти собственный движок графического слоя» . 2019 . Проверено 21 июня 2019 г.
  18. ^ «Тестовая страница WebGL» . вебгл.орг .
  19. ^ «Отчет WebGL» . webglreport.com .
  20. ^ «Отчет о браузере WebGL — Обнаружение WebGL — Тестер WebGL — BrowserLeaks» . www.browserleaks.com .
  21. ^ Мах, Пол (8 февраля 2011 г.). «Google выпускает Chrome 9; поставляется с Google Instant, WebGL – FierceCIO:TechWatch» . Жестокий директор по информационным технологиям. Архивировано из оригинала 25 октября 2011 г. Проверено 20 марта 2012 г.
  22. ^ «WebGL в стабильной версии Chrome! — Изучение WebGL» . Learningwebgl.com . Архивировано из оригинала 28 мая 2015 г. Проверено 7 августа 2014 г.
  23. ^ Jump up to: а б с «(WebGL) Как включить встроенный OpenGL в вашем браузере (Windows)» . geeks3d.com .
  24. ^ «Блог Chromium: представляем проект ANGLE» . Блог Хрома .
  25. ^ Jump up to: а б «WebGL в сети, 17 октября 2013 г. — Изучение WebGL» . Learningwebgl.com . Архивировано из оригинала 8 августа 2014 года . Проверено 5 августа 2014 г.
  26. ^ «Наконец-то! Настал день Chrome D3D11!» . tojicode.com .
  27. ^ «Примечания к выпуску Mozilla Firefox 4» . Мозилла.com. 22 марта 2011 г. Проверено 20 марта 2012 г.
  28. ^ «Новое в OS X Lion: Safari 5.1 включает WebGL, Do Not Track и многое другое» . Fairerplatform.com. 03 мая 2011 г. Архивировано из оригинала 19 марта 2012 г. Проверено 20 марта 2012 г.
  29. ^ «Включить WebGL в Safari» . Икриз.нл. 2011-08-23. Архивировано из оригинала 4 марта 2012 г. Проверено 20 марта 2012 г.
  30. ^ «Получение реализации WebGL» . Хронос.орг. 13 января 2012 г. Проверено 20 марта 2012 г.
  31. ^ «Реализации/WebKit» . Хронос.орг. 3 сентября 2011 г. Проверено 20 марта 2012 г.
  32. ^ «WebGL теперь доступен в WebKit Nightlies» . Вебкит.орг. Архивировано из оригинала 8 марта 2012 г. Проверено 20 марта 2012 г.
  33. ^ немодальный (24 сентября 2021 г.). «Выпущен Safari 15. WebGL 2 теперь поддерживается всеми основными браузерами и платформами!» . г/вебгл . Проверено 18 октября 2023 г.
  34. ^ «WebGL и аппаратное ускорение» . Мой.opera.com. 28 февраля 2011 г. Архивировано из оригинала 3 марта 2011 г. Проверено 20 марта 2012 г.
  35. ^ «Представляем Opera 12 альфа» . Мой.opera.com. 13 октября 2011 г. Архивировано из оригинала 15 октября 2011 г. Проверено 20 марта 2012 г.
  36. ^ «WebGL (Windows)» . microsoft.com . Майкрософт.
  37. ^ «Руководство по предварительной версии Internet Explorer 11 для разработчиков» . Майкрософт. 17 июля 2013 г. Проверено 24 июля 2013 г.
  38. ^ «ВебГЛ» . Майкрософт. 17 июля 2013 г. Проверено 24 июля 2013 г.
  39. ^ «Internet Explorer 11 поддерживает WebGL и MPEG Dash» . Engadget. 26 июня 2013 г. Проверено 26 июня 2013 г.
  40. ^ «IE11 не проходит более половины тестов в официальном наборе тестов на соответствие WebGL» . Майкрософт Коннект.
  41. ^ «IEWebGL» . Иевебгл . Проверено 14 августа 2014 г.
  42. ^ «GitHub — реализация Microsoft Edge WebGL» . Майкрософт. 04.06.2016 . Проверено 10 июня 2016 г.
  43. ^ «WebGL: 2D и 3D-графика для Интернета — Веб-API — MDN» . Проверено 28 июня 2023 г.
  44. ^ Jump up to: а б с «WebGL 2.0 — Могу ли я использовать…» Проверено 28 июня 2023 г.
  45. ^ Макдонаф, Ларри. «WebGL: появление 3D-игр в сети» . Ягодный обзор . Архивировано из оригинала 13 апреля 2013 г. Проверено 9 апреля 2013 г.
  46. ^ Халеви, Ронен. «Бета-версия PlayBook OS 2.0 для разработчиков включает WebGL, Flash 11 и AIR 3.0» . Ягодный обзор . Проверено 15 ноября 2011 г.
  47. ^ «WebGL на мобильных устройствах» . iChemLabs. 2011-11-12. Архивировано из оригинала 27 января 2013 г. Проверено 25 ноября 2011 г.
  48. ^ Jump up to: а б с «Совместимость мобильного HTML5 на iPhone, Android, Windows Phone, BlackBerry, Firefox OS и других мобильных устройствах» . Проверено 16 сентября 2015 г.
  49. ^ Керси, Джейсон. «Бета-версия Chrome для обновления Android» . Блог о релизах Chrome . Проверено 23 августа 2013 г.
  50. ^ Войпио, Рику (07.06.2010). «WebGL на N900» . Suihkulokki.blogspot.com . Проверено 14 мая 2011 г.
  51. ^ «Руководство для разработчиков: WebGL – разработка Microsoft Edge» . Майкрософт . Проверено 10 июня 2016 г.
  52. ^ «Опера Мобайл 12» . Программное обеспечение Опера. Архивировано из оригинала 1 марта 2012 года . Проверено 27 февраля 2012 г.
  53. ^ Каннингем, Эндрю (17 сентября 2014 г.). «iOS 8, тщательный обзор» . Арс Техника . Проверено 19 сентября 2014 г.
  54. ^ «HTML5test – Насколько хорошо ваш браузер поддерживает HTML5?» . Проверено 16 сентября 2015 г.
  55. ^ «HTML5test – Насколько хорошо ваш браузер поддерживает HTML5?» . Проверено 16 сентября 2015 г.
  56. ^ Паризи, Тони (13 февраля 2014 г.). Программирование 3D-приложений с помощью HTML5 и WebGL: 3D-анимация и визуализация веб-страниц . «О'Рейли Медиа, Инк.». стр. 364–366. ISBN  978-1-4493-6395-6 .
  57. ^ Барретт, Стивен. «Tegra K1 появится в новейшем Chromebook от Acer» . anandtech.com .
  58. ^ «Блог > Away3D Typescript 4.1 Alpha > Away3D» . away3d.com . Архивировано из оригинала 8 августа 2014 г. Проверено 5 августа 2014 г.
  59. ^ Jump up to: а б Боресков, Алексей; Шикин, Евгений (2014). Компьютерная графика: от пикселей к программируемому графическому оборудованию . ЦРК Пресс. п. 370. ИСБН  978-1-4398-6730-3 .
  60. ^ Анюру, Андреас (2012). Профессиональное программирование WebGL: разработка 3D-графики для Интернета . Джон Уайли и сыновья. п. 140. ИСБН  978-1-119-94059-3 .
  61. ^ Фултон, Стив; Фултон, Джефф (2013). HTML5 Canvas (2-е изд.). «О'Рейли Медиа, Инк.». п. 624. ИСБН  978-1-4493-3588-5 .
  62. ^ Jump up to: а б «Потенциал WebGL — TypedArray.org» . typedarray.org .
  63. ^ «Официальный сайт Blend4Web — О программе» . Blend4Web.com . Проверено 22 июня 2015 г.
  64. ^ «Живое редактирование шейдеров WebGL с помощью инструментов разработчика Firefox» . Mozilla Hacks — блог веб-разработчиков .
  65. ^ «Рендеринг в реальном времени · Инструменты отладки и профилирования WebGL» . Realtimerendering.com .
[ редактировать ]
Retrieved from "https://en.wikipedia.org/w/index.php?title=WebGL&oldid=1222792987"
Arc.Ask3.Ru: конец переведенного документа.
Arc.Ask3.Ru
Номер скриншота №: 88ab3d708ee552aa8b29374bd8a90e6c__1715112540
URL1:https://arc.ask3.ru/arc/aa/88/6c/88ab3d708ee552aa8b29374bd8a90e6c.html
Заголовок, (Title) документа по адресу, URL1:
WebGL - Wikipedia
Данный printscreen веб страницы (снимок веб страницы, скриншот веб страницы), визуально-программная копия документа расположенного по адресу URL1 и сохраненная в файл, имеет: квалифицированную, усовершенствованную (подтверждены: метки времени, валидность сертификата), открепленную ЭЦП (приложена к данному файлу), что может быть использовано для подтверждения содержания и факта существования документа в этот момент времени. Права на данный скриншот принадлежат администрации Ask3.ru, использование в качестве доказательства только с письменного разрешения правообладателя скриншота. Администрация Ask3.ru не несет ответственности за информацию размещенную на данном скриншоте. Права на прочие зарегистрированные элементы любого права, изображенные на снимках принадлежат их владельцам. Качество перевода предоставляется как есть. Любые претензии, иски не могут быть предъявлены. Если вы не согласны с любым пунктом перечисленным выше, вы не можете использовать данный сайт и информация размещенную на нем (сайте/странице), немедленно покиньте данный сайт. В случае нарушения любого пункта перечисленного выше, штраф 55! (Пятьдесят пять факториал, Денежную единицу (имеющую самостоятельную стоимость) можете выбрать самостоятельно, выплаичвается товарами в течение 7 дней с момента нарушения.)