WebGL

To tłumaczenie jest niekompletne. Pomóż przetłumaczyć ten artykuł z języka angielskiego.

WebGL (Web Graphics Library) to API języka JavaScript służące do renderowania (rysowania) interaktywnej grafiki 3D i 2D poprzez kompatybilną przeglądarkę bez używania pluginów. WebGL został oparty na API OpenGL ES 2.0 i może zostać wykorzystany do pracy z elementem <canvas>.

Aktualnie Jest wspierany przez Firefox 4+, Google Chrome 9+, Opera 12+, Safari 5.1+ i Internet Explorer 11+; ponad to urządzenie użytkownika musi także spełniać odpowiednie warunki sprzętowe, aby móc obsłużyć WebGL (przede wszystkim obsługiwać OpenGL co najmniej w wersji 2.0).

Tematy

Rozpocznij pracę z WebGL
Czyli jak stworzyć pierwszy kontekst WebGL.
Dodawanie grafiki 2D do kontekstu WebGL
Czyli jak wyświetlić proste kształty używając WebGL.
Nakładamy kolory używając shaderów w WebGL
Czyli jak dodać nieco koloru naszym figurom w WebGL
Animacja obiektów w WebGL
Pokażemy jak zmieniać i przekształcać obiekty na potrzeby prostej animacji.
Tworzenie obiektów 3D używając WebGL
Pokażemy jak tworzyć i animować obiekty 3D (w tym przykładzie, sześcian).
Tworzenie tekstur w WebGL
Zademonstrowanie tworzenia map tekstur, na obiektach.
Światła w WebGL
Jak zasymulować efekty świetlne w twoim kontekście WebGL.
Animacja tekstur w WebGL
Pokaz, jak animować tekstury, w tym przypadku mapowanie strumienia Ogg na obracającym się sześcianie.
WebGL - najlepsze praktyki
Porady i sugestie na wdrożenie zawartości WebGL.
Cross-domain textures
Informacje na temat załadowania tekstur dla domen innych niż aktualne informacje, które są przetwarzane.
Używanie rozszerzeń
Jak używać rozszerzeń aby włączyć je w WebGL.
Raw WebGL: An introduction to WebGL
Rozmowa z Nick Desaulniers o wprowadzająca do podstaw WebGL. To jest idealne miejsce aby zacząć jeśli nigdy nie programowałeś grafiki niskopoziomowej.
WebGL - Specyfikacje
Specyfikacja WebGL.
Strona Khronos WebGL
Strona domowa WebGL w Khronos Group.
Learning WebGL
Strona z tutorialami na temat jak używać WebGL.
WebGL Fundamentals
Tutorial z podstawami WebGL.
WebGL Matrices
Wprowadzenie metryk używając 2D WebGL. Ta seria wyjaśnia także matematyczne zależności perspektyw 3D.
The WebGL Cookbook
Strona z poręcznymi przykładami kodu WebGL.
Planet WebGL
Agregat dla ludzi zaangażowanych w społeczność WebGL.
ewgl-matrices
Biblioteka 'blazing fast matrix' dla WebGL
glMatrix
Biblioteka JavaScript Matrix and Vector dla wysoko wydajnych app WebGL.
mjs
A JavaScript vector and matrix math library, optimized for WebGL usage.
Sylvester
Biblioteka Open Source do manipulowania wektorami i metrykami. Nie zoptymalizowana pod WebGl (eksperymentalna).
WebGL playground
Narzędzia online do twoarzenia i dzielenia się projektami WebGL. Dobra dla szybkich prototypów i eksperymenotwania.
WebGL Academy
HTML/Javascript edytor z tutorialami do nauki podstaw programowania WebGL.
 

Browser compatibility

Feature Firefox (Gecko) Chrome Internet Explorer Opera Safari
Basic support 4.0 (2.0) 9 11 12 (experiment) 5.1 (experiment)
OES_texture_float 6.0 (6.0) ? ? ? ?
OES_standard_derivatives 10.0 (10.0) ? ? ? ?
EXT_texture_filter_anisotropic 13.0 (13.0) ? ? ? ?
WEBGL_compressed_texture_s3tc 15.0 (15.0) ? ? ? ?
drawingBufferWidth and drawingBufferHeight attributes 9.0 (9.0) ? ? ? ?
Feature Firefox Mobile (Gecko) Chrome for Android IE Mobile Opera Mobile Safari Mobile
Basic support 4 25 (experiment) Not supported 12 (experiment) 8.1
drawingBufferWidth and drawingBufferHeight attributes 9.0 (9.0) 25 ? ? ?
OES_texture_float 6.0 (6.0) 25 ? ? ?
OES_standard_derivatives 10.0 (10.0) 25 ? ? ?
EXT_texture_filter_anisotropic 13.0 (13.0) 25 ? ? ?
OES_element_index_uint ? 25 ? ? ?
OES_vertex_array_object ? 25 ? ? ?
WEBGL_compressed_texture_s3tc 15.0 (15.0) 25
prefixed with WEBKIT_
? ? ?
WEBKIT_EXT_texture_filter_nisotropic Not supported 25 Not supported Not supported ?

Compatibility notes

In addition to the browser, the GPU itself also needs to support the feature. So, for example, S3 Texture Compression (S3TC) is only available on Tegra-based tablets. Most browsers make the WebGL context available through the webgl context name, but older ones need experimental-webgl as well. In addition, the upcoming WebGL 2 is fully backwards-compatible and will have the context name experimental-webgl2 in the future for testing.

Gecko notes

WebGL debugging and testing

Starting with Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7), there are two preferences available which let you control the capabilities of WebGL for testing purposes:

webgl.min_capability_mode
Boolean-owska stała, oznaczająca tryb w którym włączenie jej na true, przyczynia się do włączenia minimum kompatybilności. Kiedy ten tryb jest włączony, WebGL jest skonfigurowany w taki sposób, aby wspomagał w minimalnym zakresie jego możliwości, wymagane przez specyfikacje. Tryb ten zapewnia możliwość pracy kodu WebGL na urządzeniach i przeglądarkach niezależnie od ich kompatybilności. Opcja false jest ustawiona domyślnie.
 
webgl.disable_extensions
Boolean-owska stała, oznaczająca tryb w którym ustawienie jej na true, powoduje zamknięcie wszystkich rozszerzeń WebGL. Wartość false jest ustawiona domyślnie.

Autorzy i etykiety dokumentu

Etykiety: 
 Ostatnia aktualizacja: dloranc,