消失的物体 - Three.js CanvasRenderer

Question

我非常困惑，不明白为什么我的对象在使用画布渲染器时会消失。虽然在WebGL渲染器上可以正常工作，但我需要在移动设备上显示它，因此无法访问WebGL渲染器。

我尝试了overdraw：true，但似乎并没有使缺失的对象消失。

http://jsfiddle.net/xH9GD/3/

当我注释掉房间时，盒子仍然存在，但在我的iPhone上它们变得非常混乱。

我理解Z-fighting的概念，但我认为这并没有发生，因为每个面的zPosition应该与其他面分离。

floor = drawTopFacingWall(room.width, room.length );
wall1 = drawLeftFacingWall( room.length, room.depth );
wall2 = drawFrontFacingWall( room.width, room.depth );
wall3 = drawRightFacingWall( room.length, room.depth );
roof = drawBottomFacingWall( room.width, room.length );
wall4 = drawBackFacingWall( room.width, room.depth );

- Steele Parker

Answer 1

由于CanvasRenderer处理深度排序的方式，"消失的"几何图形是由于其存在的限制造成的。

而WebGLRenderer在像素级别进行排序，CanvasRenderer在多边形级别进行排序。

您可以做的最好的事情就是增加几何图形的细分。

var geometry = new THREE.PlaneGeometry( width, height, 10, 10 );

three.js r.66

- WestLangley