第三天
一、点光源（PointLight），平行光（DirectionalLight）
1.点光源（PointLight）
会朝所有的方向发射光线，不能被用来创建阴影
- color - (可选参数)) 十六进制光照颜色。 缺省值 0xffffff (白色)。 intensity - (可选参数) 光照强度。 缺省值 1。
- distance - 这个距离表示从光源到光照强度为0的位置。 当设置为0时，光永远不会消失(距离无穷大)。缺省值 0.
- decay - 沿着光照距离的衰退量。缺省值 1。 在 physically correct 模式中，decay = 2。
// 创建点光源
var Pointlight = new THREE.PointLight(0xff0000, 1, 100);
Pointlight.position.set(0, 0, 15);
scene.add(Pointlight);
// 球体
var geometry = new THREE.SphereGeometry(0.3);
var material = new THREE.MeshBasicMaterial({ color: 0xffff00 });
var sphereMesh = new THREE.Mesh(geometry, material);
sphereMesh.position.copy(Pointlight.position);
sphereMesh.castShadow = true
scene.add(sphereMesh);
var ctrlObj3 = {
pointColor: 0xffffff,
PointIntensity: 6,
PointDistance: 60,
Pointdecay: 1,
}
//控制点光源属性
var crlt = new dat.GUI()
var pointLightFolder = crlt.addFolder("Pointlight")
pointLightFolder.addColor(ctrlObj3, "pointColor").onChange(function (e) {
{
Pointlight.color = new THREE.Color(e)
}
})
pointLightFolder.add(ctrlObj3, "PointIntensity", 0, 10).onChange(function (e) {
{
Pointlight.intensity = e
}
})
pointLightFolder.add(ctrlObj3, "PointDistance", 0, 1000).onChange(function (e) {
{
Pointlight.distance = e
}
})
pointLightFolder.add(ctrlObj3, "Pointdecay", 0, 10).onChange(function (e) {
{
Pointlight.decay = e
}
})
2.平行光（DirectionalLight）
相当于远光的效果，例如太阳，太阳的光线彼此平行，其光强不会随着配置的目标对象的增大而减弱。
- color - (可选参数) 16进制表示光的颜色。 缺省值为 0xffffff (白色)。
- intensity - (可选参数) 光照的强度。缺省值为1。
// 创建平行光
var directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
scene.add(directionalLight);
二、半球光（HemisphereLight）
光源直接放置于场景之上，光照颜色从天空光线颜色颜色渐变到地面光线颜色。
HemisphereLight( skyColor : Integer, groundColor : Integer, intensity : Float )
- skyColor - (可选参数) 天空中发出光线的颜色。 缺省值 0xffffff。
- groundColor - (可选参数) 地面发出光线的颜色。 缺省值 0xffffff。
- intensity - (可选参数) 光照强度。 缺省值 1。
var hemisphereLight = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
scene.add( hemisphereLight );
var ctrlObj = {
hemisphereLightVisible:true,
skyColor:0xffffff,
groundColor:0x00ff00, //地面光线颜色属性
hemisphereIntensity:1
}
var ctrl = new dat.GUI()
var hemisphereLightFolder = ctrl.addFolder("hemisphereLightVisible");
hemisphereLightFolder.add(ctrlObj,"hemisphereLightVisible",0,1).onChange(function(e){
hemisphereLight.visible = e
})
hemisphereLightFolder.addColor(ctrlObj,"skyColor").onChange(function(e){
hemisphereLight.color = new THREE.Color(e)
})
hemisphereLightFolder.addColor(ctrlObj,"groundColor").onChange(function(e){
hemisphereLight.groundColor = new THREE.Color(e)
})
hemisphereLightFolder.add(ctrlObj,"hemisphereIntensity",0,1).onChange(function(e){
hemisphereLight.intensity = e
})
三、平面光光源（RectAreaLight）
平面光光源从一个矩形平面上均匀地发射光线。这种光源可以用来模拟像明亮的窗户或者条状灯光光源。
实际在家具建模应用中广泛应用
注意事项:
- 不支持阴影。
- 只支持 MeshStandardMaterial 和 MeshPhysicalMaterial 两种材质。
- 你必须在你的场景中加入 RectAreaLightUniformsLib 。
RectAreaLight( color : Integer, intensity : Float, width : Float, height : Float )
- color - (可选参数) 十六进制数字表示的光照颜色。缺省值为 0xffffff (白色)
- intensity - (可选参数) 光源强度／亮度 。缺省值为 1。
- width - (可选参数) 光源宽度。缺省值为 10。
- height - (可选参数) 光源高度。缺省值为 10。
var width = 10;
var height = 10;
var intensity = 1;
var rectLight = new THREE.RectAreaLight( 0xffffff, intensity, width, height );
rectLight.position.set( 5, 5, 0 );
rectLight.lookAt( 0, 0, 0 );
scene.add( rectLight )
rectLightHelper = new THREE.RectAreaLightHelper( rectLight );
scene.add( rectLightHelper );
四、平面几何体（PlaneGeometry）
PlaneGeometry(width : Float, height : Float, widthSegments : Integer, heightSegments : Integer)
- width — 平面沿着X轴的宽度。默认值是1。
- height — 平面沿着Y轴的高度。默认值是1。
- widthSegments — （可选）平面的宽度分段数，默认值是1。
- heightSegments — （可选）平面的高度分段数，默认值是1。
var geometry = new THREE.PlaneGeometry( 5, 20, 32 );
var material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
var plane = new THREE.Mesh( geometry, material );
scene.add( plane );
