CONTENTS iii

4.1.4 The OpenGL 1.1 Lighting Equation . . . . . . . . . . . . . . . . . . . . . 141

4.2 Light and Material in OpenGL 1.1 . . . . . . . . . . . . . . . . . . . . . . . . . . 144
4.2.1 Working with Material . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 144
4.2.2 Defining Normal Vectors . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147
4.2.3 Working with Lights . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 149
4.2.4 Global Lighting Properties . . . . . . . . . . . . . . . . . . . . . . . . . . 151
4.3 Image Textures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153
4.3.1 Texture Coordinates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 154
4.3.2 MipMaps and Filtering . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157
4.3.3 Texture Target and Texture Parameters . . . . . . . . . . . . . . . . . . . 158
4.3.4 Texture Transformation . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159
4.3.5 Loading a Texture from Memory . . . . . . . . . . . . . . . . . . . . . . . 160
4.3.6 Texture from Color Buffer . . . . . . . . . . . . . . . . . . . . . . . . . . . 161
4.3.7 Texture Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162
4.3.8 Loading Textures in C . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163
4.3.9 Using Textures with JOGL . . . . . . . . . . . . . . . . . . . . . . . . . . 165
4.4 Lights, Camera, Action . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
4.4.1 Attribute Stack . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
4.4.2 Moving Camera . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 169
4.4.3 Moving Light . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171

5 Three.js: A 3D Scene Graph API 173

5.1 Three.js Basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173
5.1.1 About JavaScript Modules . . . . . . . . . . . . . . . . . . . . . . . . . . 174
5.1.2 Scene, Renderer, Camera . . . . . . . . . . . . . . . . . . . . . . . . . . . 176
5.1.3 THREE.Object3D . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178
5.1.4 Object, Geometry, Material . . . . . . . . . . . . . . . . . . . . . . . . . . 179
5.1.5 Lights . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187
5.1.6 A Modeling Example . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
5.2 Building Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192
5.2.1 Polygonal Meshes and IFSs . . . . . . . . . . . . . . . . . . . . . . . . . . 192
5.2.2 Curves and Surfaces . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 196
5.2.3 Textures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200
5.2.4 Transforms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 203
5.2.5 Loading Models . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204
5.3 Other Features . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205
5.3.1 Instanced Meshes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205
5.3.2 User Input . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 206
5.3.3 Shadows . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210
5.3.4 Cubemap Textures and Skyboxes . . . . . . . . . . . . . . . . . . . . . . . 212
5.3.5 Reflection and Refraction . . . . . . . . . . . . . . . . . . . . . . . . . . . 213

6 Introduction to WebGL 217

6.1 The Programmable Pipeline . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 218
6.1.1 The WebGL Graphics Context . . . . . . . . . . . . . . . . . . . . . . . . 218
6.1.2 The Shader Program . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 220
6.1.3 Data Flow in the Pipeline . . . . . . . . . . . . . . . . . . . . . . . . . . . 221
6.1.4 Values for Uniform Variables . . . . . . . . . . . . . . . . . . . . . . . . . 224