THREE.CubeTextureLoader 1px边缘错误

Question

我使用THREE.CubeTextureLoader创建全景立方体：

pano = [
    'scenes/4/2048/px.jpg', 'scenes/4/2048/nx.jpg',
    'scenes/4/2048/py.jpg', 'scenes/4/2048/ny.jpg',
    'scenes/4/2048/pz.jpg', 'scenes/4/2048/nz.jpg',
];
newCubeTexture = cubeTextureLoader.load(pano);
geometry = new THREE.BoxGeometry(20000, 20000, 20000);
material = new THREE.MeshBasicMaterial({
    envMap: newCubeTexture,
    side: THREE.BackSide,
    color: 0xffffff,
    transparent: true,
    opacity: 0
});
mesh = new THREE.Mesh(geometry, material);

但是当加载纹理时，边缘会看到1px的bug。

为什么会出现这种情况？

P.S。如果我使用地图加载每一面的纹理都很好！

new THREE.MeshBasicMaterial({
    map: new THREE.ImageUtils.loadTexture(arr[i]),
    side: THREE.BackSide,
    transparent: true,
    opacity: 0
});

Answer 1

@WestLangley在他的评论中有很好的观点。除了这些之外，我想指出的是，人为地创建一个巨型盒子的方法还有一些缺点，因为它仍然会变形，并且容易在边界上进行Z角战斗。

在Three.js的现代版本中，更好的替代方法是将CubeTexture从cubeTextureLoader.load分配到scene.background。