DirectionalLight 方向光光源

—> Light —> Object3D

DirectionalLight 是只有方向, 但没有 angle 和 distance 的光源, 被它照射到的整个区域接收的光强度是一样的, 没有渐变. 这就是与 SpotLight 的区别. 太阳光相对于整个宇宙中的是一个点光 源 PointLight, 但对于地球, 那就是方向光了, 从它发出的光线到达地球, 都是平行的. 可以把 DirectionalLight 看成是一个距离非常非常遥远的光源. 下面演示当中, 你可看到 Cube 和 Fish 都被完整的展示了, 没有任何切割. 而 Sphere 没有全部亮起来的原因是基于 MeshStandardMaterial 这种材质.

function DirectionalLight( color, intensity ) { } var light = new THREE.DirectionalLight(0xffff00); light.position.set(0, 0, 5); scene.add(light); var cubeMaterial = new THREE.MeshLambertMaterial({color: 0xffffff}), sphereMaterial = new THREE.MeshStandardMaterial({color:0xffffff}), fishMaterial = new THREE.MeshPhongMaterial({color: 0xffffff, side:THREE.DoubleSide}); var targetObj = new THREE.Object3D(); targetObj.position.set( 0, 0, 5 ); scene.add(targetObj); light.target = targetObj;

Attributes

type : String

Default value : 'DirectionalLight'
Description : 类型.

isDirectionalLight : Boolean

Default value : true (只读)
Description : 类型是否为DirectionalLight.

shadow : DirectionalLightShadow

Default value : new DirectionalLightShadow()
Description : 阴影.

target : Object3D

Default value : new Object3D()
Description : 投射目标.

图解API

方向光的方向由它的position和target决定, 是从position到target的一条射线. 可参看 DirectionalLightHelper 方向光助手. target不明指时, 为原点Vector3(0, 0, 0). 多个方向光可产生不同的阴影. 点开查看

addDirectionalLight(-10, 7, 6, 0xffff00); addDirectionalLight(0,10,0, 0xffffff); var geometry = new THREE.SphereGeometry(3, 64, 64), material = new THREE.MeshPhongMaterial({color: 0x663399}); mesh = new THREE.Mesh( geometry, material ); mesh.castShadow = true; scene.add(mesh); var floorGeometry = new THREE.PlaneBufferGeometry( 50, 50), floorMaterial = new THREE.MeshLambertMaterial( { color: 0x666666 }), floor = new THREE.Mesh( floorGeometry, floorMaterial ); floor.rotation.x = -Math.PI/2; floor.position.y = -9; floor.position.z = -10; floor.receiveShadow = true; scene.add( floor ); function addDirectionalLight(x,y,z,color){ var light = new THREE.DirectionalLight(color); light.position.set(x,y,z); scene.add(light); light.castShadow = true; light.shadow.mapSize.width = 200; light.shadow.mapSize.height = 200; light.shadow.camera.left = -5; light.shadow.camera.right = 5; light.shadow.camera.top = 5; light.shadow.camera.bottom = -5; light.shadow.camera.near = 1; light.shadow.camera.far = 45; light.shadow.bias = -0.005; } renderer.shadowMap.enabled = true;