Pregunta

Estoy tratando de crear una caja de SkyBox simple usando tres.js, pero se ha encontrado con un problema con la textura que estoy aplicando al cubo solo trabajando en el exterior, y no se muestra en el interior del cubo.

Aquí está mi código Skybox:

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);

Aquí hay una versión en vivo http://projects.harrynorthver.com/landscape/src/

¡Muchas gracias en avanzado!

¿Fue útil?

Solución

object.flipSided se ha ido desde R50.Se reemplazó con object.material = THREE.BackSide.Comprobando Ejemplos actualizados que utilizan la misma característica y también esto migration página debe ser útil en casos como este.

Otros consejos

También he visto el interruptor "Flipido" en otros ejemplos y no logró que funcione (podría estar desactualizado).Lo que funciona para mí (con una esfera) está estableciendo una escala negativa:

skybox.scale.x = -1;

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top