Three.js Unculled SkyBox

Question

skybox에 camera.far 매개 변수가 적용되지 않습니다. 하늘 상자가 아닌 다른 모든 장면 개체를 추려내고 싶습니다.

skyBox.frustumCulled = false;으로 설정하면 아무런 차이가 없습니다. skyBox은 물론 메쉬입니다.

다른 렌더 패스를 추가하면됩니까? 그렇다면 하늘 상자를 볼 수 있도록 정말 멀리있는 두 개의 다른 카메라가 필요합니다. 이것이 어떻게 효율적으로 이루어질 수 있습니까?

shader = THREE.ShaderLib["cube"]; 
    shader.uniforms["tCube"].value = this.cubetexture; 

    mat = new THREE.ShaderMaterial({ 
     uniforms: shader.uniforms, 
     fragmentShader: shader.fragmentShader, 
     vertexShader: shader.vertexShader, 
     depthWrite: false, 
     side: THREE.BackSide 
    }); 

    geo = new THREE.BufferGeometry().fromGeometry(new THREE.BoxGeometry(1024, 1024, 1024)); 

    mesh = new THREE.Mesh(geo, mat); 

    mesh.rotation.y += 90; 

    mesh.scale.x = mesh.scale.y = mesh.scale.z = 50; 

    mesh.frustumCulled = false; 
    mesh.matrixAutoUpdate = false; 
    mesh.rotationAutoUpdate = false; 
    mesh.updateMatrix(); 

    this.skybox = mesh; 

    scene.add(this.skybox); 

Answer 1

당신은 '주'장면에서 스카이 박스를 추가하고 여기 명확성을 위해

은 스카이 박스를 그리기에 사용되는 내 지형 오브젝트 코드의 조각이다. 스카이 돔을 달성하는 더 좋은 방법은 새로운 장면을 만드는 것입니다. 이것은 당신의 '주요'장면에 대한 '배경'이 될 것입니다. skydomes v.s에 대한 토론도 있습니다. skyboxes, 간단히 말해서, 상자가 polys를 저장, 돔이 더 좋아 보인다. 이 예제에서는 돔/구를 사용합니다.

var renderer = new THREE.WebGLRenderer({alpha: true, antialias: true}); 
var mainScene = new THREE.Scene(); 
var mainCamera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 20000); 

var skydome = { 
    scene: new THREE.Scene(), 
    camera: new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 20000); 
}; 

skydome.material = new THREE.MeshBasicMaterial({color: 0x0F0F0F}) //the material for the skydome, for sake of lazyness i took a MeshBasicMaterial. 
skydome.mesh = new THREE.Mesh(new THREE.SphereGeometry(100, 20, 20), skydome.material); 
skydome.scene.add(skydome.mesh); 

이제 렌더링 기능을 사용하면 위치가 아닌 스카이 돔 카메라의 회전 만 조정할 수 있습니다.

var render = function(){ 
    requestAnimationFrame(render); 
    skydome.camera.quaternion = mainCamera.quaternion; 
    renderer.render(skydome.scene, skydome.camera); //first render the skydome 
    renderer.render(mainScene, mainCamera);//then render the rest over the skydome 
}; 
renderer.autoclear = false; //otherwise only the main scene will be rendered.