5种光源

光源将影响物体显示的明暗，对渲染效果的影响非常的大。threejs中定义了基础氛围光，平行光，点光源，聚光灯光源，球谐光等光源。每种光源都有不同的效果。

AmbientLight(氛围光)

氛围光作为基础光线，将应用到场景中的所有三维物体上，一般需要配合其他光源一起使用。AmbientLight不能产生阴影，也不需要指定坐标位置。设置好颜色和强度就ok了。

ambientLight = new THREE.AmbientLight(0xDFDFDF, 0.3);
scene.add(ambientLight);

DirectionalLight（平行光）

DirectionalLight是较经常使用的光源，它的光纤都是平行向着一个方向发射的。所以使用DirectionalLight我们可以模拟类似太阳光的环境光照效果。

lightDirect = new THREE.DirectionalLight(0xf2f2f2, 0.8);
lightDirect.position.set(20, 20, -20); 
scene.add(lightDirect);

PointLight（点光源）

点光源类似我们生活中的灯泡，光是没有固定方向，向着四周散射的。

lightPoint = new THREE.PointLight(0xE9E9E9, 0.9);
lightPoint.position.set(0, 10, -5);
scene.add(lightPoint);

SpotLight（聚光灯光源）

SpotLight可以产生类似聚光灯的效果。

lightSpot = new THREE.SpotLight(0xE9E9E9);
    lightSpot.position.set(0, 20, -20);
    lightSpot.castShadow = true;
    lightSpot.angle = Math.PI / 4;
    lightSpot.penumbra = 0.3;
    scene.add(lightSpot);

HemisphereLight（半球光源）

HemisphereLight可以更加真实的模拟自然光源，因为它不仅可以提供天空中的光线，还提供了来自地面漫反射的地面光线。HemisphereLight不能产生阴影

var light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 ); scene.add( light ); 第一个参数是天空的光线颜色，第二个参数是地面反射光的颜色，第三个参数是强度

阴影

伴随着光源随之一起的自然是阴影，开启阴影对增强三维物体的立体效果十分明显。但是，一般开启实时渲染的阴影，对性能也有一定的损失。 threejs在场景中，我们想让物体产生阴影，需要做以下设置：

设置渲染器开启阴影

renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;

设置光线开启阴影

light.castShadow = true;

设置需要产生阴影的mesh

cube.castShadow = true;

设置接收阴影的mesh（如地面等）

plane.receiveShadow = true;

4种材质

材质一般是应用在mesh上，用来模拟物体的表面，在光线、阴影等因素的作用下所展示出来的最终效果。比如我们经常说的高光材质，漫反射材质等等，其实都是在描述物体的表面如何处理光线作用。不同的作用结果，最终将呈现不同的效果到我们的眼睛。threejs常见的内置材质有基础材质（MeshBasicMaterial），高光材质（MeshPhongMaterial），漫反射材质（MeshLambertMaterial），标准PBR材质（MeshStandardMaterial）等。

1.MeshBasicMaterial 材质是一种较为基础材质，且不会受光照的影响，所以物体看上去并没有很多棱角，而偏向扁平化。

2.MeshPhongMaterial 高光材质，用来模拟一些高光效果。类似金属，塑料这种有高光斑点的材质。

3.MeshLambertMaterial材质是漫反射材质，漫反射材质一般用来模拟表面较为粗糙，不会直接反射的表面，而是漫反射光线的材质。例如墙壁、衣服等。

4.MeshStandardMaterial 一种pbr(Physically based rendering)材质，用来模拟物理的材质属性。一般使用金属性metalness和粗糙度roughness来控制最终外观的效果。

示例
// let mesh = gltf.scene//模型对象
// mesh.material = new THREE.MeshStandardMaterial({
//   // 默认 0.5. 0.0到1.0之间的值可用于生锈的金属外观
//   metalness: 0.5,
//   // 材料的粗糙程度. 0.0表示平滑的镜面反射，1.0表示完全漫反射. 默认 0.5
//   roughness: 0.5,
// })
// gltf.scene.material.shininess = 1;
// gltf.scene.castShadow = true;
// gltf.scene.receiveShadow = true;

// gltf.scene.material.transparent = true; //材质允许透明 如果有玻璃材质时开启
// gltf.scene.material.opacity = 1; //材质默认透明度

threejs之模型光源,材质的设置和理解