Chapter 2. Your First WebGL Program

Now that we have covered the core concepts and, I hope, developed a basic understanding of the workings of WebGL, it is time to put that knowledge to use. In the next several chapters, we will create a series of WebGL sample pages, leading up to the development of a full application. Before we get going with that, we need to take a look at one more piece of our technology puzzle: Three.js.

Three.js—A JavaScript 3D Engine

Necessity is the mother of invention. It couldn’t have been too long before somebody out there, dreading writing the same hundreds of lines of WebGL code over again, wrapped her work in a library that could be used for general-purpose 3D programming. In fact, several somebodies have done it. There are quite a few good open source libraries built for WebGL available, including GLGE (, SceneJS (, and CubicVR ( Each library does things a bit differently, but they share the goal of implementing high-level, developer-friendly features on top of raw WebGL.

The library we will use throughout this book is called Three.js, the creation of one Mr.doob, a.k.a. Ricardo Cabello Miguel, a programmer based in Barcelona, Spain. Three.js provides an easy, intuitive set of objects that are commonly found in 3D graphics. It is fast, using many best-practice graphics engine techniques. It is powerful, with several built-in object types and handy utilities. It is open source, hosted ...

Get WebGL: Up and Running now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.