在使用 aoMap 时需要注意 设置 aoMapIntensity 遮挡强度， aoMapIntensity: 0 完全禁用遮挡效果。 aoMapIntensity: 1 完全使用 aoMap 的效果 aoMapIntensity: 2 增强遮挡效果，可能会使阴影变得更深。，还是一个就是使用 aoMap 时需要 aoMap 是一个灰度图，纯白色表示不摭挡光照效果，纯黑色表示完全摭挡光照效果，这个是配合 map 使用的
在使用 bumpMap 时 要注意贴图黑色部分由 bumpScale 决定 凹凸强度 为负数时 黑色部分 凹 陷 为正数时 黑色部分 凸出
displacementBias 常用于精确控制位移的起始点。比如，如果默认位移使得模型的某部分看起来偏高，可以通过减小 displacementBias 来平衡这个偏移，确保效果符合预期。
lightMap 它的主要作用是控制物体表面的亮度和反射的间接光，而不是改变颜色。
MeshStandardMaterial 有三十三个属性
- alphaMap alpha贴图是一张灰度纹理，用于控制整个表面的不透明度。（黑色：完全透明；白色：完全不透明）。 默认值为null。需要注意要使透明贴图生效要设置 transparent = true
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
const textureLoader = new THREE.TextureLoader();
const clearcoatMap = textureLoader.load(imgPng);
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
color: 0xFFFFFF, // 基础颜色
alphaMap: clearcoatMap, // 设置 alphaMap 纹理
transparent: true
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- aoMap 该纹理的红色通道用作环境遮挡贴图。默认值为null。aoMap需要第二组UV。 当通道值红色越小时越能反射灯光颜色
// 从 HDR 图像生成 PMREM 贴图
const pmremTexture = pmremGenerator.fromEquirectangular(hdrTexture).texture;
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
const textureLoader = new THREE.TextureLoader();
const clearcoatMap = textureLoader.load(imgPng);
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
color: 0xFFFFFF, // 基础颜色
aoMap: clearcoatMap, // 设置 alphaMap 纹理
aoMapIntensity: 1.0 // 环境光遮蔽强度
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 设置第二组 UV 坐标
Plane.setAttribute('uv2', new THREE.BufferAttribute(Plane.attributes.uv.array, 2));
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- aoMapIntensity 环境遮挡效果的强度。默认值为1。零是不遮挡效果。
- bumpMap 用于创建凹凸贴图的纹理。黑色和白色值映射到与光照相关的感知深度。凹凸实际上不会影响对象的几何形状，只影响光照。如果定义了法线贴图，则将忽略该贴图。
// 从 HDR 图像生成 PMREM 贴图
const pmremTexture = pmremGenerator.fromEquirectangular(hdrTexture).texture;
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
const textureLoader = new THREE.TextureLoader();
const clearcoatMap = textureLoader.load(imgPng);
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
color: 0xFFFFFF, // 基础颜色
bumpMap: clearcoatMap, // 凹凸贴图
bumpScale: 0.5 // 凹凸强度
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- bumpScale 凹凸贴图会对材质产生多大影响。典型范围是0-1。默认值为1。
- color 材质的颜色(Color)，默认值为白色 (0xffffff)。
- defines WebGLRenderer使用它来选择shaders
- displacementMap 位移贴图会影响网格顶点的位置，与仅影响材质的光照和阴影的其他贴图不同，移位的顶点可以投射阴影，阻挡其他对象， 以及充当真实的几何体。位移纹理是指：网格的所有顶点被映射为图像中每个像素的值（白色是最高的），并且被重定位。 当贴中为靠近黑色时进行 偏移，为白色时不变 由 displacementScale displacementBias这两个参数控制
// 从 HDR 图像生成 PMREM 贴图
const pmremTexture = pmremGenerator.fromEquirectangular(hdrTexture).texture;
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
const textureLoader = new THREE.TextureLoader();
const clearcoatMap = textureLoader.load(person);
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
color: 0xFFFFFF, // 基础颜色
displacementMap: clearcoatMap, // 位移贴图
displacementScale: 0.5, // 位移强度
displacementBias: -0.1 // 位移偏移量
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- displacementScale 位移贴图对网格的影响程度（黑色是无位移，白色是最大位移）。如果没有设置位移贴图，则不会应用此值。默认值为1。
- displacementBias 位移贴图在网格顶点上的偏移量。如果没有设置位移贴图，则不会应用此值。默认值为0。
- emissive 材质的放射（光）颜色，基本上是不受其他光照影响的固有颜色。默认为黑色。
// 从 HDR 图像生成 PMREM 贴图
const pmremTexture = pmremGenerator.fromEquirectangular(hdrTexture).texture;
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
color: 0xFFFFFF, // 基础颜色
emissive: 0xFF0000, // 发光颜色（红色）
emissiveIntensity: 2.0 // 发光强度
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- emissiveMap 设置放射（发光）贴图。默认值为null。放射贴图颜色由放射颜色和强度所调节。 如果你有一个放射贴图，请务必将放射颜色设置为黑色以外的其他颜色。
emissiveMap的纹理中，较亮的部分会发光更强，较暗的部分发光较弱。
// 从 HDR 图像生成 PMREM 贴图
const pmremTexture = pmremGenerator.fromEquirectangular(hdrTexture).texture;
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
const textureLoader = new THREE.TextureLoader();
const clearcoatMap = textureLoader.load(person);
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
color: 0xFFFFFF, // 基础颜色
emissive: 0x00FF00, // 发光颜色（绿色）
emissiveMap: clearcoatMap, // 发光贴图
emissiveIntensity: 2.0 // 发光强度
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- emissiveIntensity 放射光强度。调节发光颜色。默认为1。
- flatShading 定义材质是否使用平面着色进行渲染。默认值为false。
- fog 材质是否受雾影响。默认为true。
- isMeshStandardMaterial 检查当前对象是否为标准网格材质的标记。
- lightMap 光照贴图。默认值为null。lightMap需要第二组UV。
// 从 HDR 图像生成 PMREM 贴图
const pmremTexture = pmremGenerator.fromEquirectangular(hdrTexture).texture;
scene.background = pmremTexture; // 作为背景图像
scene.environment = pmremTexture; // 作为全局环境贴图
const textureLoader = new THREE.TextureLoader();
const clearcoatMap = textureLoader.load(person);
// 创建使用 MeshPhongMaterial 的材质
const material = new THREE.MeshStandardMaterial({
lightMap: clearcoatMap, // 光照贴图（第二组 UV 坐标）
lightMapIntensity: 1.0 // 控制光照贴图的强度
});
// 创建几何体，例如一个球体
const Plane = new THREE.SphereGeometry(1, 32, 32);
// 为几何体添加第二组 UV 坐标（如果它们不存在）
Plane.attributes.uv2 = Plane.attributes.uv;
// 将材质和几何体结合生成网格
const PlaneMesh = new THREE.Mesh(Plane, material);
PlaneMesh.position.y = -2;
PlaneMesh.position.x = 1;
PlaneMesh.position.z = 1;
// 将球体添加到场景中
scene.add(PlaneMesh);
- lightMapIntensity 烘焙光的强度。默认值为1。
- map 颜色贴图。可以选择包括一个alpha通道，通常与.transparent 或.alphaTest。默认为null。 纹理贴图颜色由漫反射颜色.color调节。
- metalness 材质与金属的相似度。非金属材质，如木材或石材，使用0.0，金属使用1.0，通常没有中间值。 默认值为0.0。0.0到1.0之间的值可用于生锈金属的外观。如果还提供了metalnessMap，则两个值相乘。
- metalnessMap 该纹理的蓝色通道用于改变材质的金属度。
- normalMap 用于创建法线贴图的纹理。RGB值会影响每个像素片段的曲面法线，并更改颜色照亮的方式。法线贴图不会改变曲面的实际形状，只会改变光照。
- normalMapType 法线贴图的类型。选项为THREE.TangentSpaceNormalMap（默认）和THREE.ObjectSpaceNormalMap。
- normalScale 法线贴图对材质的影响程度。典型范围是0-1。默认值是Vector2设置为（1,1）。
- refractionRatio 空气的折射率（IOR）（约为1）除以材质的折射率。它与环境映射模式THREE.CubeRefractionMapping 和THREE.EquirectangularRefractionMapping一起使用。 折射率不应超过1。默认值为0.98。
- roughness 材质的粗糙程度。0.0表示平滑的镜面反射，1.0表示完全漫反射。默认值为1.0。如果还提供roughnessMap，则两个值相乘。
- roughnessMap 该纹理的绿色通道用于改变材质的粗糙度。
- wireframe 将几何体渲染为线框。默认值为false（即渲染为平面多边形）。
- wireframeLinecap 定义线两端的外观。可选值为 'butt'，'round' 和 'square'。默认为'round'。 该属性对应2D Canvas lineJoin属性， 并且会被WebGL渲染器忽略。
- wireframeLinejoin 定义线连接节点的样式。可选值为 'round', 'bevel' 和 'miter'。默认值为 'round'。 该属性对应2D Canvas lineJoin属性， 并且会被WebGL渲染器忽略。
- wireframeLinewidth 控制线框宽度。默认值为1。 由于OpenGL Core Profile与大多数平台上WebGL渲染器的限制，无论如何设置该值，线宽始终为1。
