双面闪烁 - z指数战斗

Question

我想用强线框线制作网格。当我用双材质绘制面时，一个用于着色，第二个用于线条（线框），我得到了这些闪烁的线条。 http://jsfiddle.net/jn_09/atTXN/3/我猜它直接连接到z-index。那么这种行为有什么解决方案吗？ WebGL接缝以相同的方式工作。

此案例仅限Google Chrome。

非常感谢

Answer 1

这个问题在GitHub上多次引发CanvasRenderer。看来，当您使用CanvasRenderer时，您的脸部会因不同的摄像机角度而移位。例如，当您使用某些图像作为纹理时 - 在旋转对象时，图像会变形。

查看将阴影面设置为完全透明时会发生什么：http://jsfiddle.net/EEywu/。它们不再“跳过”你的线框（因为它们是不可见的）。

现在，这就是WebGL在游戏中出现的原因，与你所说的相反，它不会产生相同的效果，至少在默认情况下如此。不良部分 - 如果您使用的是Windows，则不会在WebGL上看到任何线框线的粗细：http://jsfiddle.net/XQz3g/。

所以，我猜你的选择是：使用WebGL来对抗这个东西或使用不同的几何形状（行平面）和增加的段数，如下所示：

var plane = new THREE.PlaneGeometry( 300, 300, 4, 4 );

这将创建您的平面不仅有2个面（三角形），还有32个（4x4x2）。这样，相机角度处的小平面偏移量将是最小的，您将不会注意到任何闪烁。如果你有很多这样的平面由画布渲染，这会杀死你的FPS。

所以，请知道这是否有帮助！