Skip to content

灯光

灯光类型

点光源

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

平行光

js
var light = new BABYLON.DirectionalLight("DirectionalLight", new BABYLON.Vector3(0, -1, 0), scene);

聚光灯

js
var light = new BABYLON.SpotLight(
  "spotLight",
  new BABYLON.Vector3(0, 30, -10), //光源位置
  new BABYLON.Vector3(0, -1, 0), //光源照射方向
  Math.PI / 3, //光源发散角度
  2, //指数(光衰减速度,值越大衰减越快)
  scene
);

半球光

模拟周围环境光

js
var light = new BABYLON.HemisphericLight("HemiLight", new BABYLON.Vector3(0, 1, 0), scene);

灯光颜色

漫反射diffuse

对象提供基本的颜色

镜面反射specular

可以在模型对象上生成高亮颜色

底色groundColor

仅适用于半球光,底色光的方向和漫反射、镜面反射光的方向相反

js
var light = new BABYLON.HemisphericLight("HemiLight", new BABYLON.Vector3(0, 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, 0, 1); //蓝

半球光 如图,漫反射和镜面反射光在模型上方,底色光在模型底部

光源数量限制

Babylon.js 允许创建尽可能多的光源,但是单个的StandardMaterial材质只能处理默认定义数量(默认四个)的光源。可以使用下面的方式设置更多:

js
var material = new BABYLON.StandardMaterial("mat", scene);
material.maxSimultaneousLights = 6; //设置最大响应6个灯光

注意

使用更多的动态光源,Babylon.js 将生产更多的着色器,不兼容低配设备,谨慎添加

开关灯和调整亮度

开关灯

js
light.setEnabled(false); //关灯
light.setEnabled(true); //开灯

调整亮度

js
light0.intensity = 0.5;
light1.intensity = 2.4;

点光和聚光灯亮度调整

js
light.range = 100;

指定照亮哪些物体

js
var spheres = []; //球模型集合
light0.excludedMeshes.push(spheres[7], spheres[18]); //排除照亮物体
light1.includedOnlyMeshes.push(spheres[7], spheres[18]); //指定照亮物体

光照贴图 Lightmaps

复杂光照效果的计算成本非常高。为了节省资源,使用光照贴图将计算的光照存储在网格的纹理中

js
var lightmap = new BABYLON.Texture("lightmap.png", scene); //新建纹理
var material = new BABYLON.StandardMaterial("material", scene); //新建材质
material.lightmapTexture = lightmap; //将纹理又应用到材质的光照贴图中

场景灯光与光照贴图的三种混合方式:

js
// 仅将光照贴图应用到灯光的和阴影上
light.lightmapMode = BABYLON.Light.LIGHTMAP_SPECULAR;
// 仅将光照贴图应用到灯光的镜面反射发光和阴影上
light.lightmapMode = BABYLON.Light.LIGHTMAP_SHADOWSONLY;
// 默认模式, 光源效果和光照贴图混合
light.lightmapMode = BABYLON.Light.LIGHTMAP_DEFAULT;

投影纹理

  • 给灯光直接定义纹理贴图,光源透过贴图折射出各种颜色效果,类似舞厅的气氛灯
  • 仅聚光灯 Spotlight 支持此功能
js
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);

为了控制投影的方向和范围,我们可以调整以下几个灯光属性:

  • projectionTextureLightNear:接近投影纹理的范围。平面在进入光照范围之前,投影纹理不显示。
  • projectionTextureLightFar:远离投影纹理的范围。平面在进入光照范围之前,投影纹理不显示。
  • projectionTextureUpDirection:帮助定义朝向灯光照射方向的光空间,并与其向上对齐。