Chapter 3. Working with Light Sources in Three.js

InChapter 1, Creating Your First 3D Scene with Three.js, you learned about the basics of Three.js, and in Chapter 2, The Basic Components that Make Up a Three.js Application, we looked a bit deeper at the most important parts of the scene: the geometries, meshes, and cameras. You might have noticed that we skipped exploring the details of lights in that chapter even though they make up an important part of every Three.js scene. Without lights, we won't see anything rendered (unless you use basic or wireframe materials). Since Three.js contains a large number of lights, each of which has a specific use, we'll use this chapter to explain the various details of the lights and prepare you for the upcoming chapters on material usage.

Note

WebGL itself doesn't have inherent support for lighting. Without Three.js, you would have to write specific WebGL shader programs to simulate these kinds of lights. A good introduction on simulating lighting in...