首页 > 解决方案 > 防止灯光照在物体上 three.js ;图层

问题描述

我试图让 light1 只在 object1 上(都在第 0 层上)而 light2 在 object2 上(都在第 1 层上)。我正在尝试使用图层。然而,当我将相机放在两层(第 0 层和第 1 层)上时。灯光显然会影响两层的物体。

我使用了Three.js 中的一种解决方法——如何防止光线照射在物体上

但仍然感觉应该有一个很好的分层解决方案......这就是他们的目的吗?

谢谢!

var ambientLight = getAmbientLight(2);
var pointLight = getPointLight(0.5);

function getAmbientLight(intensity) {
var light = new THREE.AmbientLight(0xffffff, intensity);

return light;
}

function getPointLight(intensity) {
var light = new THREE.PointLight(0xffffff, intensity);
//light.castShadow = true;
light.layers.set(1);
return light;
}


var loader = new THREE.GLTFLoader();
            loader.load( 'models/scene.gltf', function ( gltf ) {

            console.log(gltf.scene);

                gltf.scene.traverse( function ( child ) {
                    if ( child.isMesh ) {
                        child.layers.set(0);
                        console.log(child);
                    }
                } ); 
                scene.add( gltf.scene ); 
            }, undefined, function ( e ) {
                console.error( e );
            } );

var sphere = getSphere (0.4, 10, 10);

function getSphere(r) {
var geometry = new THREE.SphereGeometry(r, 24, 24);

var material = new THREE.MeshLambertMaterial( {
    color: 'rgb(100,100,100)'
    //side: THREE.DoubleSide
    } );

var mesh = new THREE.Mesh( 
    geometry, 
    material );
mesh.layers.set(1); 
    return mesh; 
}

标签: three.js

解决方案


如文档 ( https://threejs.org/docs/#api/en/core/Layers ) 中所述,图层旨在控制对象的可见性。所以一个对象只有在它与给定的相机共享一个公共层时才会被渲染。现在不能使用图层来确定哪些对象应该受到哪些光源的影响(也称为选择性照明)。请为此使用提到的解决方法。此外,请阅读以下 github 问题以获取有关该主题的更多信息:

https://github.com/mrdoob/three.js/issues/5180

three.js R96


推荐阅读