Moving a light source along a path

In the Add an moving all-directional light recipe, we moved a light source up and down. While these simple kinds of paths are often enough, there are cases where you want more control over how your light source moves through a scene. In this recipe, we'll show you how you can move a light source along a predefined path.

Getting ready

To create this recipe, we'll use a THREE.SplineCurve3D and THREE.SpotLight object. As both of these objects are included with Three.js, we don't need to take any steps to get ready. A good thing to do, however, is look at the provided example for this recipe, which will show you what you'll get when you execute the steps from this recipe when you run the 05.06-move-a-light-through-the-scene.html example:

In the screenshot, you can see a light that moves slowly along the purple line. In the next section, we'll show you how you can create this yourself.

How to do it...

For this recipe, we first need to create the path that we'll follow...