Working with sprite maps
At the beginning of this chapter, we used a THREE.Sprite
object to render single points. These sprites were positioned somewhere in the 3D world, and their size was based on the distance from the camera (this is also sometimes called billboarding). In this section, we’ll show an alternative use of the THREE.Sprite
object: we’ll show you how you can use THREE.Sprite
to create a layer similar to a HUD for your 3D content using an extra THREE.OrthographicCamera
instance and an additional THREE.Scene
. We will also show you how to select the image for a THREE.Sprite
object using a sprite map.
As an example, we’re going to create a simple THREE.Sprite
object that moves from left to right over the screen. In the background, we’ll render a 3D scene with a camera, which you can move to illustrate that the THREE.Sprite
object moves independently of the camera. The following screenshot shows what we’ll be creating for the first example...