Simple Materials: MeshDepthMaterial
Explore the MeshDepthMaterial in Three.js, which defines mesh appearance based on its distance to the camera rather than light or color properties. Learn how to combine it with MeshBasicMaterial using blending modes to create fading and brightness effects. This lesson guides you through practical examples, helping you understand and manipulate material properties and camera settings to enhance 3D visuals.
We'll cover the following...
The THREE.MeshDepthMaterial
The next material on the list is THREE.MeshDepthMaterial. With this material, the way an object looks isn’t defined by lights or by a specific material property–it is defined by the distance from the object to the camera. We can, for instance, combine this with other materials to easily create fading effects. The only additional property this material has is one we saw in THREE.MeshBasicMaterial: the wireframe property.
Example: Mesh depth material
To demonstrate this material, we created an example that we can view by opening the mesh-depth-material.js example:
