Using separate materials for faces

Each geometry in Three.js consists of a number of vertices and faces. In most cases, when you define a material that can be used together with a geometry, you use a single material. With Three.js, however, it is also possible to define a unique material for each of the faces of your geometry. You could, for instance, use this to apply different textures to each side of a model of a house. In this recipe, we will explain how to set up the materials so that you can use different textures for individual faces.

Getting ready

In this recipe, we won't use any external textures or libraries. It is good, however, to look at the final result that we'll be creating in this recipe. For this, open the 04.06-use-separate-materials-for-faces.html ...

Get Three.js Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.