Question

我创造了两个面部接触的透明盒子。除非盒子的面部接触，否则这种效果很好。

// inner object
var mesh2 = new THREE.Mesh(geometry, material); 

mesh2.position.x = 0;
mesh2.position.y = 0;
mesh2.position.z = 0;

mesh2.scale.x = 100;
mesh2.scale.y = 50;
mesh2.scale.z = 100;

scene.add( mesh2 ); 

// outer object
var mesh1 = new THREE.Mesh(geometry, material); 

mesh1.position.x = 0;
mesh1.position.y = 0;
mesh1.position.z = 0;

mesh1.scale.x = 100;
mesh1.scale.y = 100;
mesh1.scale.z = 100; 

scene.add( mesh1 );

这是代码： http://jsfiddle.net/unkya/14/

如何摆脱这些瑕疵仍然让脸部触碰？

此外，有没有办法将框添加到场景中而不必先插入最内层的框？

非常感谢！

Answer 1

这称为z-fighting。

有两种解决方法。

第一个是简单地将值抵消少量。甚至0.01可能会这样做。这里的重要部分是确保您的相机near plane and far plane在合理的范围内。

第二种方法是使用THREE.js材料的polygonOffset属性。这将允许您强制对象在其他对象上方或下方渲染，类似于z索引排序。我相信还需要启用透明度，所以如果可能的话，你应该把它放在你的半透明立方体上。

Three.js触摸面部神器

1 个答案: