dat.gui辅助调试光照参数

上节课给大家介绍了dat.gui.js,下面继续演示通过dat.gui辅助调试光照参数。

调节平行光光照强度

const directionalLight = new THREE.DirectionalLight(0xffffff, 1.0);
// gui调试平行光光照强度
gui.add(directionalLight,'intensity',0,10);

设置环境贴图影响系数

gui属性改变，递归遍历修改每个材质的环境贴图影响系数envMapIntensity

gui.add({envMapIntensity:2},'envMapIntensity',0,10).onChange(function(v){
    gltf.scene.traverse(function (obj) {
        if (obj.isMesh) {
            obj.material.envMapIntensity = v;
        }
    })
});