I have been meaning to get into WebGL for a while, and a few days ago I discovered this excellent WebGL library called Three.js on Github.
Someone requested an Anaglyph WebGL Renderer for it, so I thought I might give it a try. After reading up on the code I came up with an example you can find here (NOTE: Works best on latest version of Chrome and Firefox).
The author of Three.js has already fixed my version and incorporated an actual anaglyph renderer into his code. Here is an example.
If you are interested in WebGL development I would recommend checking out Three.js.
Pixel Perfect 
Comments on: "WebGL Anaglyph 3D using Three.js" (5)
[…] Dig out your 3D glasses for this anaglyph demo from Shayan Javed. […]
Hi,
I’m trying to understand how do you this and reproduce it in a simple WebGL application.
Can you please telle me if you render the object twice or more ? or all the job is doing in the shader ?
Can you gie us the shader or a webgl code ?
Thanks a lot.
The Three.js library source code is available for everyone to see. You can access the source code here:
https://github.com/mrdoob/three.js
Basically the scene is rendered twice from two different camera viewpoints (into two textures) and then they are combined and rendered in a shader. Here is the AnaglyphRenderer:
https://github.com/mrdoob/three.js/blob/master/src/extras/renderers/AnaglyphWebGLRenderer.js
Fantastic work, really. It’s great to see an anaglyph example of WebGL, but there is one major flaw: there is no calibration for the red and cyan! Many monitors display colors differently and many glasses have subtle differences in the filters. A demo like this on my machine/glasses filters the red quite well (in the cyan) but does not filter the cyan well at all (with the red). The result is pretty heavy ghosting, which ruins the 3D effect.
Once again, great job. It could be stellar with a calibration that allowed users to set the levels of red and cyan to fit their unique screen/glasses combo.
I hope you are not offended by this suggestion! Keep up the good work.
Never offended by a suggestion! Thanks for the comment – I have never really thought about calibration. Though my Anaglyph Renderer was crudely built the author of Three.js has incorporated his own (as you can see in one of the examples). I would suggest giving it as a suggestion to him (through the github repository for Three.js). I’m not even sure how I would do the whole filtering thing with different monitors/glasses.