携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第18天，点击查看活动详情 >
MeshToonMaterial
卡通材质，如图所示，可以实现比较撕漫的效果；
// gradientMap用于卡通着色的渐变贴图。需要设置纹理。默认值null。
// texture的minFilter和magFiltern设置为NearestFilter，可以不丢失动画效果且设置阶梯颜色变化
material.gradientMap = matcapsGradients3;
实现效果：
textures：
MeshStandardMaterial
这种材质使用更加正确的物理计算来决定物体表面如何与场景中的光源互动；提供了metalness（金属感程度）与roughness （材质粗糙程度）使得使用场景++；
// 材质与金属的相似度。非金属材质，如木材或石材，使用0.0，金属使用1.0，通常没有中间值。 默认值为0.0
material.metalness = 0;
// 材质的粗糙程度。0.0表示平滑的镜面反射，1.0表示完全漫反射。默认值为1.0。
material.roughness = 0;
// 光罩贴图，会让深坑得地方更暗，更有真实感
material.aoMap = doorAmbientOcclusionTexture
// 设置光照贴图的强度
material.aoMapIntensity = 10
// 颜色贴图、法线贴图、高光贴图、金属度贴图…共用一组纹理坐标uv，用来设置阴影的光照贴图lightMap使用另外一组纹理坐标uv2进行映射。
// 所以我们需要为我们的gemoetry设置uv2
plane.geometry.setAttribute('uv2',new THREE.BufferAttribute(plane.geometry.attributes.uv.array,2))
添加了阴影的效果如下图，为了便于观察，我的强度给的比较大
// Displacement Map（置换贴图，也叫移位贴图）可以改变模型对象的几何形状，因此在提供最真实的效果的同时也会大幅增加渲染性能的开销。
material.displacementMap = doorHeightTexture;
// 强度
material.displacementScale = 0.05
// 但我们设置后发现模型并没有产生高低起伏的效果，是由于我们的三角面片的数量不足；
// 增加三角面片个数
const plane = new THREE.Mesh(new THREE.PlaneBufferGeometry(1,1,100,100),material)
// 法线贴图
material.normalMap = doorNormalTexture
material.normalScale.set(0.5, 0.5)
material.transparent = true
material.alphaMap = doorAlphaTexture
法线贴图是通过改变光线的折射从而改变模型的整体效果，而置换贴图则是通过改变模型表面的立体结构进而改变模型的立体视觉效果。
// 全景贴图
const cubeTextureLoader = new THREE.CubeTextureLoader()
const environmentMapTexture = cubeTextureLoader.load([
'/textures/environmentMaps/0/px.jpg',
'/textures/environmentMaps/0/nx.jpg',
'/textures/environmentMaps/0/py.jpg',
'/textures/environmentMaps/0/ny.jpg',
'/textures/environmentMaps/0/pz.jpg',
'/textures/environmentMaps/0/nz.jpg'
])
const material = new THREE.MeshStandardMaterial()
material.metalness = 0.7
material.roughness = 0.2
// 环境贴图
material.envMap = environmentMapTexture
MeshPhysicalMaterial
MeshStandardMaterial的扩展，能够更好地控制反射率。为了获得最佳效果，您在使用此材质时应始终指定环境贴图。
如果有哪里描述不准确或者有问题,欢迎大佬指正!
(≖ᴗ≖)✧
