kirin77 发表于 2022-2-9 11:54

Three.js光源梳理3——平行光(DirectionalLight)

平行光本质是一个方向向量,在shader中计算时直接与模型顶点的法线方向进行dot点乘操作。

如果L(平行光)的向量与N(顶点法线方向)一样(N Dot L=1),那么表示模型的这个点正对着光源,应该最亮,相反,如果两个向量呈相反方向(N Dot L=-1),那么则表示这个点背对光源,应该最暗。

image.png

基础的兰伯特计算模型的明暗就是NdotL。

与Unity中的平行光不一样的是,Unity中平行光仅使用方向不使用位置来表示平行光方向;而Three.js中是设定一个起点和一个终点(默认为0,0,0),来确定平行光的方向。因此Three.js中通常在创建完成后设定一下光照的位置,如下:
            const dirLight = new THREE.DirectionalLight(0xFFFFFF, 1);            dirLight.position.set(5, 5, 5);            scene.add( dirLight );
平行光是可以产生阴影的,需要将castShadow打开,如下
            //开启该光源阴影            dirLight.castShadow = true;            //获取该光源产生的shadow,并设置参数            //具体shadow的参数设置后续再讲解            dirLight.shadow.mapSize.width = 2048;            dirLight.shadow.mapSize.height = 2048;            dirLight.shadow.camera.left = -10;            dirLight.shadow.camera.right = 10;            dirLight.shadow.camera.top = -10;            dirLight.shadow.camera.bottom = 10;            dirLight.shadow.camera.near = 4;            dirLight.shadow.camera.far = 16;            dirLight.shadow.radius = 0.1;            dirLight.shadow.bias = 0.0000000001;
也可以设置光源照射的对象target,光的照射终点会跟随着物体移动(默认为上述的0,0,0)。

无论在Unity中还是Three.js中,平行光通常是场景中的主光源,也通常是产生阴影、计算亮暗面的主要光源。
页: [1]
查看完整版本: Three.js光源梳理3——平行光(DirectionalLight)