babylonjs 光源基础

868 阅读2分钟

光源类型

点光源

从一个点的位置向所有方向发射的光源。

   var light = new BABYLON.PointLight("pointLight", new BABYLON.Vector3(1, 10, 1), scene);

定向光

生成一种向着一个确定的方向平行照射的光线。

//第二个参数表示所有光线射向的方向
var light = new BABYLON.DirectionalLight("DirectionalLight", new BABYLON.Vector3(0, -1, 0), scene);

聚光灯

定义一个从一个点向特定方向内的一定角度发射光线的聚光灯光源。

//第二个参数的聚光灯的位置,第三个是聚光灯的朝向,第四个是光锥的角度,第五个是光的衰减速度,值越大衰减得越快。
var light = new BABYLON.SpotLight("spotLight", new BABYLON.Vector3(0, 30, -10), new BABYLON.Vector3(0, -1, 0), Math.PI / 3, 2, scene);

半球光

一种简单的模拟环境光的方式,和定向光最大的区别是可以定义groundColor,表示来自光源方向相反的光线的颜色。

屏幕截图 2022-01-19 153059.png

//第二个参数为光射来的方向
var light = new BABYLON.HemisphericLight("hemiLight", new BABYLON.Vector3(1, 1, 0), scene);

light.diffuse = new BABYLON.Color3(1, 0, 0);
light.specular = new BABYLON.Color3(0, 1, 0);
light.groundColor = new BABYLON.Color3(0.27, 0.11, 0.71);

光源数量限制

一个材质默认最多接受四个光源,但可通过调整参数来修改限制。

material.maxSimultaneousLights = 6;

光源开关与强度设置

light.setEnabled(true);//开
light.setEnabled(false);//关
//强度设置,初始值为1
light0.intensity = 0.5;
light1.intensity = 2.4;
//光照射距离
light.range = 100;

设置模型是否被照射

屏幕截图 2022-01-19 154739.png

light1.excludedMeshes.push(spheres[7], spheres[18])	//设置不照亮特定模型

屏幕截图 2022-01-19 154821.png

light1.includedOnlyMeshes.push(spheres[7], spheres[18])	//设置只照亮特定模型

照明法线

灯光对网格的反应取决于为每个网格顶点设置的值,称为法线,如下图所示,箭头表示灯光法线的方向。这张图显示了两个平面和两个灯光。一个是聚光灯,另一个是点光源。当法线指向你的时候,每个平面的正面就是你看到的那个面,背面则是相反的面。

image.png 如图所示,图中聚光灯和点光源只照亮了平面的正面(蓝色),未照亮背面(紫色)。

材质的光照映射纹理

用纹理的形式来简化存储材质在复杂光照条件下贴图的表现。

var lightmap = new BABYLON.Texture("lightmap.png", scene);
var material = new BABYLON.StandardMaterial("material", scene);
material.lightmapTexture = lightmap;

image.png

light.lightmapMode = BABYLON.Light.LIGHTMAP_DEFAULT;//在计算光照效果后将结果混合光照映射纹理

image.png

light.lightmapMode = BABYLON.Light.LIGHTMAP_SPECULAR;//只对镜面反射和阴影使用光照映射纹理

image.png

light.lightmapMode = BABYLON.Light.LIGHTMAP_SHADOWSONLY//只对阴影使用光照映射纹理

纹理投影

定义光照表面所呈现的纹理,目前只有聚光灯光源支持。 image.png

var spotLight = new BABYLON.SpotLight("spot02", new BABYLON.Vector3(30, 40, 30),
        new BABYLON.Vector3(-1, -2, -1), 1.1, 16, scene);
spotLight.projectionTexture = new BABYLON.Texture("textures/stainedGlass.png", scene);