three-光照

271 阅读1分钟
「这是我参与11月更文挑战的第24天,活动详情查看:2021最后一次更文挑战

半球光(HemisphereLight)

光源直接放置于场景之上,光照颜色从天空光线颜色渐变到地面光线颜色。

半球光不能投射阴影

HemisphereLight( skyColor : Integer, groundColor : Integer, intensity : Float )

  • skyColor - (可选参数) 天空中发出光线的颜色。 缺省值 0xffffff。
  • groundColor - (可选参数) 地面发出光线的颜色。 缺省值 0xffffff。
  • intensity- (可选参数) 光照强度。 缺省值 1。
const hemiLight = new THREE.HemisphereLight( 0xffffff, 0xffffff, 0.6 );
hemiLight.color.setHSL( 0.6, 1, 0.6 );
hemiLight.groundColor.setHSL( 0.095, 1, 0.75 );
hemiLight.position.set( 0, 50, 0 );
scene.add( hemiLight );

属性(Properties)

  • castShadow: Boolean该参数在构造时被设置为 undefined 因为半球光不能投射阴影。

  • colorFloat, 在构造时传递的天空发出光线的颜色。 默认会创建 Color 并设置为白色(0xffffff)。

  • groundColor : Float。在构造时传递的地面发出光线的颜色。 默认会创建 Color 并设置为白色(0xffffff)。

  • position : Vector3。假如这个值设置等于 Object3D.DefaultUp (0, 1, 0),那么光线将会从上往下照射。

HemisphereLightHelper

创建一个虚拟的球形网格 Mesh 的辅助对象来模拟 半球形光源 HemisphereLight.

HemisphereLightHelper( light : HemisphereLight, sphereSize : Number, color : Hex )

  • light -- 被模拟的光源.
  • size -- 用于模拟光源的网格尺寸.
  • color -- (可选的) 如果没有赋值辅助对象将使用光源的颜色.
const light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
const helper = new THREE.HemisphereLightHelper( light, 5 );
scene.add( helper );

平行光(DirectionalLight)

平行光是沿着特定方向发射的光。这种光的表现像是无限远,从它发出的光线都是平行的。常常用平行光来模拟太阳光 的效果; 太阳足够远,因此我们可以认为太阳的位置是无限远,所以我们认为从太阳发出的光线也都是平行的。

平行光可以投射阴影

Three.js 的平行光常见的困惑是设置旋转没有效果

// White directional light at half intensity shining from the top. 
const directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 ); 
scene.add( directionalLight );

DirectionalLight( color : Integer, intensity : Float )

  • color - (可选参数) 16进制表示光的颜色。 缺省值为 0xffffff (白色)。
  • intensity - (可选参数) 光照的强度。缺省值为1。

DirectionalLightHelper

于模拟场景中平行光 DirectionalLight 的辅助对象. 其中包含了表示光位置的平面和表示光方向的线段.

const light = new THREE.DirectionalLight( 0xFFFFFF ); 
const helper = new THREE.DirectionalLightHelper( light, 5 ); 
scene.add( helper );

DirectionalLightHelper( light : DirectionalLight, size : Number, color : Hex )

  • light-- 被模拟的光源.
  • size -- (可选的) 平面的尺寸. 默认为 1.
  • color -- (可选的) 如果没有设置颜色将使用光源的颜色.