三.js天空盒纹理问题

Question

我正在尝试使用 Three 创建一个简单的天空盒.js但是我应用于立方体的纹理仅在外部工作，而不显示在立方体内部时遇到了问题。

这是我的天空盒代码：

var path = assetPath + skyboxPrefix;
var urls = [ path + 'alpine_front.jpg',
             path + 'alpine_back.jpg',
             path + 'alpine_left.jpg',
             path + 'alpine_right.jpg',
             path + 'alpine_top.jpg' ];
var cubeTexture = THREE.ImageUtils.loadTextureCube( urls );
var shader = THREE.ShaderUtils.lib["cube"];
shader.uniforms["tCube"].texture = cubeTexture;
var skyboxMaterial = new THREE.ShaderMaterial( {
    uniforms        : shader.uniforms,
    fragmentShader  : shader.fragmentShader,
    vertexShader    : shader.vertexShader,
    depthWrite      : false
} );
var skyboxGeom = new THREE.CubeGeometry( 10000, 10000, 10000 );
skybox = new THREE.Mesh( skyboxGeom, skyboxMaterial );
skybox.flipSided = true;
    
scene.add(skybox);

这是实时版本 http://projects.harrynorthover.com/landscape/src/

Answer 1

object.flipSided自R50以来就消失了。它被替换为object.material = THREE.BackSide.检查使用相同功能的更新示例以及此迁移页面应该在此类情况下很方便。

Answer 2

我也在其他示例中看到了"flipSided"开关，但没有让它工作（可能已经过时了）。对我有用的（带球体）是设置负比例：

skybox.scale.x = -1;