Case Study: WebGL 360° Panorama

A 360° walk-through of my office. This is a case study with the ThreeJS 3D engine for HTML5 Canvas and WebGL. I have adapted the ThreeJS WebGL equirectangular panorama demo, making it fall back to Canvas renderer when browser doesn't support WebGL. The overlaying markers are DOM objects. There's some coordinates conversion between ThreeJS 3D world and 2D DOM. In this adaptation, there are 2 spherical panoramas so users can navigate and see more corners of the office. Just for fun and experimental purpose, some snowing effect added on the occasion of Christmas 2011.

Components used:
- ThreeJS WebGL equirectangular panorama demo
- Snowing effect by Seb Lee-Delisle

Finally, check out the demo and grab the source code.