WebGL
Summary
WebGL is a standard that allows you to create real 3D content and render it in a web browser. WebGL is the web binding to the OpenGL ES 2.0 graphics API, and therefore allows us to run real 3D across any system with a browser that supports it and the graphics capabilities to handle such visually rich content. WebGL is maintained by the Khronos Group for 3D graphics on the Web. In web technology terms, WebGL is the 3D drawing context of the HTML5 <canvas> element and can be used through the HTML5 Canvas element with a Javascript API.
webgl
WebGL educational material
You can start studying WebGL with the WebGL tutorials.
The following sites feature WebGL introductions and tutorials as well
The following books on WebGL have been published
- WebGL: Up and Running, O’Reilly Media ISBN: 978-1449323578
- Programming 3D Applications with HTML5 and WebGL ISBN: 978-1-4493-6296-6
- WebGL Beginner’s Guide, Packt Publishing ISBN: 978-1849691727
- Beginning WebGL for HTML5, Apress Publishing ISBN: 978-1430239963
- Professional WebGL Programming: Developing 3D Graphics for the Web ISBN: 978-1119968863
The following videos feature tutorials and explanations about WebGL
WebGL reference
You can consult the WebGL Reference
Additional reference resources on WebGL can be found on the Khronos WebGL page
WebGL Availability
Not all browsers support WebGL yet. To test whether your browser supports WebGL go to the [test page]
Statistics of support
| Source | Support |
|---|---|
| WebGL Stats, July 4, 2014 | 74% |
| Can I Use, July 4, 2014 | 65% |
Browser Support
| IE | Firefox | Chrome | Safari | Opera | iOS Safari | Opera Mini | Android Browser | Chrome for Android | |
|---|---|---|---|---|---|---|---|---|---|
| Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes |
Source: Can I Use, May 1. 2015
OS, GPU and Driver Support
The criteria for support differ from browser to browser. The details of support are listed at:
- The Google Chrome WebGL and 3D graphics support page
- The Mozilla Wiki entry on Blocked Graphics Drivers
Examples / Best Practices
- Drawing Images using WebGL
- Working with the Convolution Matrix
- Working with the Extended ColorTransform Matrix