Learn Three.js - Third Edition

Repeat wrapping

When you apply a texture to a geometry created by Three.js, Three.js will try to apply the texture as optimally as possible. For instance, for cubes, this means that each side will show the complete texture, and for spheres, the complete texture is wrapped around the sphere. There are, however, situations where you won't want the texture to spread around a complete face or the complete geometry, but rather have the texture repeat itself. Three.js provides functionality that allows you to control this. An example where you can play around with the repeat properties is provided in 21-repeat-wrapping.html. The following screenshot shows this example:

Before this property will have the desired effect, you need to make sure that ...