Three.js：使用图像纹理会导致其他对象消失

我试图形象化时空多维数据集。作为参考，我在google上找到这个图像：http://www.intechopen.com/source/html/38305/media/image7.jpeg。其实我设法做到了，但是一旦我开始在立方体的底部使用纹理（这是我的例子中的一个平面），就会出现一个奇怪的错误。飞机上方的东西有时并不总是可见的，图像有时会被扭曲。这是很难解释的，所以你可能检查jfiddle了我创建：Three.js：使用图像纹理会导致其他对象消失

http://jsfiddle.net/fGwsB/

我使用的CanvasRenderer并载入纹理folows：

texturemat = new THREE.MeshLambertMaterial({ 
    side: THREE.DoubleSide, 
    map: THREE.ImageUtils.loadTexture(background)});

如果背景是包含一个字符串链接到图像文件。

控件已启用，因此您可能需要缩放并旋转一下以使错误出现。

来源

2014-01-07 Schnodderbalken

由于处理深度排序的方式，“消失”几何体由于CanvasRenderer的限制而引起。

虽然WebGLRenderer在像素级别排序，但CanvasRenderer会在多边形级别排序。

您所能做的最好的事情就是增加您已经在做的几何图形的镶嵌细分。

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

此外，添加更多的点到你的线将有所帮助。

就失真而言，也可以通过增加曲面细分来改善。见ThreeJS Cube texture strange visual。

three.js所r.64

来源

2014-01-07 17:39:16 WestLangley

其实，建立镶嵌并没有改变结果。添加更多点是有问题的，因为这些点稍后来自外部数据源。当我切换到WebGLRenderer时，背景是黑色的，没有显示透明度。 – Schnodderbalken

这是您看到的工件的解释。 CanvasRenderer是有限的。如果您想更改渲染器并遇到问题，那么您需要创建一个新帖子。 – WestLangley

Three.js：使用图像纹理会导致其他对象消失

回答

相关问题