Thanks to Chris Blizzard ( @chrisblizzard ) for putting me on the right track for finding WebGL documention. There is no documentation anywhere yet, but it turns out WebGL is built on top of OpenGL ES 2.0 . That is an embedded version of OpenGL designed to drive the latest graphics chips out there, with full support for programmable shaders. It can be found in the latest iPhone 3GS phone - but not the older iPhone 3G, which only has hardware that can support OpenGL ES 1.1.
OpenGL ES 2.0 is a subset of OpenGL, based on the 2.x spec. That means that my old OpenGL books (the Red and Blue books) are not very helpful for learning WebGL. Fortunately, there is a new book, the " OpenGL ES 2.0 Programming Guide ", known as the "Gold Book", which covers this new API.
I just finished Chapter 2 of the book, "Hello Triangle: An OpenGL ES 2.0 Example", which contains a program that draws a simple triangle. That's great, because my previous experiment also contained a triangle program. The two programs did vary slightly however. So what I have done below is rewrite the example from the book in JavaScript using WebGL, using (mostly) the same sequence of calls. I think it turned out reasonably clean.
If you don't see anything above, WebGL probably isn't working in your browser.
As I work through the book, I'll be posting my experiments here, so stay tuned!
Update: I added an extra gl.flush(), and now it works with the custom-built WebKit nightly with WebGL available from here .
Update 2: WebGL is enabled in recent WebKit nightlies on Mac, flip the pref: defaults write com.apple.Safari WebKitWebGLEnabled -bool YES (via @smfr )
I'm playing around with Smart and Penman to see if I can use it to display some experiments as I learn WebGL. Looks good so far.
What you might see below (if you are using a Firefox Nightly Build , and you have set webgl.enabled_for_all_sites to true in about:config), is an embedded iframe with a simple WebGL demo in it.
My knowledge of WebGL is not developed yet - I got the source for the black triangle from this helpful blog post . Hopefully it's OK that I just copied it, there wasn't a license file -- I added some attribution and I can remove it if it's a problem.
If you don't see anything above, WebGL probably isn't working in your browser.
I currently can't find much in the way of documentation on WebGL on the web. But I do own several OpenGL books, and I've long been wanting to learn it. Hopefully, WebGL stays fairly close to OpenGL, and I can figure it out. I'll post my learning experiments here, and on GitHub .
This is a new blog which I'm going to use to post my WebGL experiments on.
Here are some more places you can find me:
