How to use the MeshDepthMaterial function from three
Find comprehensive JavaScript three.MeshDepthMaterial code examples handpicked from public code repositorys.
three.MeshDepthMaterial is a material in the Three.js library that is used to render objects with depth information as grayscale colors.
6 7 8 9 10 11 12 13 14 15this.pickingTexture = new THREE.WebGLRenderTarget(1, 1, {minFilter: THREE.LinearFilter}); this.renderTarget = new THREE.WebGLRenderTarget(0, 0, {minFilter: THREE.LinearFilter}); this.pixelBuffer = new Uint8Array(4); this.pickedObject = null; this.selectableObjects = {}; this.skinningDepthMaterial = new THREE.MeshDepthMaterial( { skinning: true, morphTargets: true, depthTest: true,
268
0
2+ 3 other calls in file
747 748 749 750 751 752 753 754 755 756this.beautyRenderTarget.depthTexture = depthTexture; this.beautyRenderTarget.depthBuffer = true; } this.depthMaterial = new THREE.MeshDepthMaterial(); this.depthMaterial.depthPacking = THREE.RGBADepthPacking; this.depthMaterial.blending = THREE.NoBlending; this.normalMaterial = new THREE.MeshNormalMaterial(); this.normalMaterial.blending = THREE.NoBlending;
371+ 35 other calls in file
How does three.MeshDepthMaterial work?
three.MeshDepthMaterial is a class in the Three.js library that represents a material for rendering objects with a depth texture, where the resulting color is based on the distance from the camera to the object. It calculates depth values from a depth texture that is usually rendered to a separate framebuffer object. It can be used to create special effects or to visualize depth in 3D scenes. It inherits properties from the three.Material class and supports various customizations such as changing the depth function and the depth write status.
48 49 50 51 52 53 54 55 56 57depthTexture = new three_1.DepthTexture(); depthTexture.type = three_1.UnsignedShortType; this.beautyRenderTarget.depthTexture = depthTexture; this.beautyRenderTarget.depthBuffer = true; } this.depthMaterial = new three_1.MeshDepthMaterial(); this.depthMaterial.depthPacking = three_1.RGBADepthPacking; this.depthMaterial.blending = three_1.NoBlending; this.normalMaterial = new three_1.MeshNormalMaterial(); this.normalMaterial.blending = three_1.NoBlending;
130
223 224 225 226 227 228 229 230 231 232inst.wireframe, inst.morphTargets]; } /** * Property getter THREE.MeshDepthMaterial */ function getter_THREE_MeshDepthMaterial(inst) { return [ inst.name,
002+ 5 other calls in file
Ai Example
1 2 3 4const geometry = new THREE.BoxGeometry(1, 1, 1); const material = new THREE.MeshDepthMaterial(); const cube = new THREE.Mesh(geometry, material); scene.add(cube);
In this example, a BoxGeometry is created and a MeshDepthMaterial is assigned as its material. This material renders the depth of objects in a scene as grayscale, where objects closer to the camera appear lighter and objects farther away appear darker. Finally, the mesh is added to the scene.
three.Vector3 is the most popular function in three (22341 examples)