Learn Three.js - Third Edition

Creating fake reflections using an environment map

Calculating environment reflections is very CPU-intensive, and it usually requires a ray tracer approach. If you want to use reflections in Three.js, you can still do that, but you'll have to fake it. You can do so by creating a texture of the environment the object is in and applying it to the specific object. First, we'll show you the result that we're aiming for (see 17-env-map-static.html, which is also shown in the following screenshot):

In the preceding screenshot, you can see that the sphere and cube reflect the environment. If you move your mouse around, you can also see that the reflection ...