WebGL

Edit
Watch

1. Development topics
2. Resources
3. Browser compatibility
1. 3.1. Gecko notes
  1. 3.1.1. Gecko 6.0 notes
4. Special topics

WebGL brings 3D graphics to the Web by introducing an API that closely conforms to OpenGL ES 2.0 that can be used in HTML5 canvas elements. Support for WebGL is present in Firefox 4 and Google Chrome 9.

Development topics

Getting started with WebGL: How to set up a WebGL context.
Adding 2D content to a WebGL context: How to render simple flat shapes using WebGL.
Using shaders to apply color in WebGL: Demonstrates how to add color to shapes using shaders.
Animating objects with WebGL: Shows how to rotate and translate objects to create simple animations.
Creating 3D objects using WebGL: Shows how to create and animate a 3D object (in this case, a cube).
Using textures in WebGL: Demonstrates how to map textures onto the faces of an object.
Lighting in WebGL: How to simulate lighting effects in your WebGL context.
Animating textures in WebGL: Shows how to animate textures; in this case, by mapping an Ogg video onto the faces of a rotating cube.
Cross-domain textures: Information about loading textures from domains other than the one from which your content was loaded.

Resources

WebGL Specification: The WebGL specification.
Khronos WebGL site: The main web site for WebGL at the Khronos Group.
Learning WebGL: A site with tutorials on how to use WebGL.
The WebGL Cookbook: A web site with handy recipes for writing WebGL code.
Sylvester: An open source library for manipulating vectors and matrices.
Planet WebGL: A feed aggregator for people involved in the WebGL community.

Browser compatibility

Desktop
Mobile

Feature	Firefox (Gecko)	Chrome	Internet Explorer	Opera	Safari
Basic support	4.0 (2.0)	9	--	--	Nightly build
Context name	`experimental-webgl`	`experimental-webgl`	n/a	n/a	`experimental-webgl`

Feature	Firefox Mobile (Gecko)	Android	IE Mobile	Opera Mobile	Safari Mobile
Basic support	?	?	?	?	?
Context name	?	?	?	?	?

Gecko notes

Requires Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3)

Gecko 6.0 notes

Support for the OES_texture_float extension was added to Gecko 6.0.

Special topics

Cross-Domain Textures

HTML5 Documentation
HTML	Audio/Video Canvas WebGL SVG MathML WebForms AppCache Microformats SemanticTags
Javascript	Storage IndexDB WebSockets WebWorkers Events Drag/Drop ProtocolHandler Geolocation Focus
CSS	NewSelectors Typography Visual Effects

Tags (3)

Edit tags

Attachments (0)

Images 0
No images to display in the gallery.

Attach file

Sep	OCT	Nov
	06
2010	2011	2012