3

Three.jsを使用して単純な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);

これがライブバージョンですhttp://projects.harrynorthover.com/landscape/src/

4

2 に答える 2

5

object.flipSidedr50からなくなっています。に置き換えられましたobject.material = THREE.BackSide。同じ機能を使用する更新された例と、この移行ページを確認すると、このような場合に便利です。

于 2012-10-01T11:07:13.513 に答える
1

他の例でも「flipSided」スイッチを見たことがありますが、機能しませんでした（古くなっている可能性があります）。私にとって（球を使って）うまくいくのは、負のスケールを設定することです：

skybox.scale.x = -1;
于 2012-10-01T09:11:20.760 に答える