javascript - 消失的对象 - Three.js CanvasRenderer

Question

我很困惑，我不明白为什么我的对象会随着 Canvas 渲染器消失。虽然它与 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 );

Answer 1

“消失”的几何图形是由 CanvasRenderer 处理深度排序方式的限制引起的。

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

您能做的最好的事情就是增加几何体的分割。

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

three.js r.66