背景
3D模型下载地址： sketchfab.com/3d-models/o…
sketchfab渲染的
我渲染的
两者还是存在很大的差异，革命尚未成功，仍需继续努力。
截止目前遇到并解决了下面这些问题。
问题1: 标准网格材质的颜色贴图map为空，导致模型成黑色
解决方式：
- 查看下载资源textures目录下，是否有颜色贴图map需要的图片
- 有的话，使用这些图片自己创建一个纹理贴图
const texture = new THREE.TextureLoader().load( "textures/leaf_old_tree_diffuse.png" );
问题2: 渲染的树干纹理错误
需要设置纹理贴图在水平方向/垂直方向上如何包裹
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
问题3: 渲染出来的叶子不是叶子的形状
如下图所示：
叶子是一个长方形
此时，我们可以通过设置透明性和透明度或者a测试。
- 设置透明度transparent为true，透明度opacity为1。
- 设置a测试为0.5.
问题4: 模型贴图后，颜色比原始的颜色浅
解决方式是设置颜色贴图的colorSpace如下：
colorMap.colorSpace = THREE.SRGBColorSpace // 颜色贴图颜色浅的解决方案
知识延伸
材质贴图
-
颜色贴图 map
颜色贴图（Color Map）通常指的是纹理贴图（Texture Map），它用于给模型表面添加颜色和细节。颜色贴图是一种图像，其中每个像素的颜色值对应于模型表面上相应点的颜色。
-
法线贴图 normalMap
-
凹凸贴图
-
法线贴图和凹凸贴图的区别
法线贴图和凹凸贴图都是用于在三维模型表面模拟细节的技术，但它们的实现方式和效果有所不同。
-
法线贴图（Normal Mapping）* ：
- 原理：法线贴图通过改变模型表面的光照效果来模拟细节。它使用一张纹理贴图来存储每个像素的法线向量信息，这些法线向量决定了光照如何在模型表面反射。
- 效果：法线贴图可以在不增加模型多边形数量的情况下，为模型表面添加高频率的细节，如凹凸、划痕、皱纹等。它可以让低多边形模型看起来具有高多边形模型的细节。
- 使用：法线贴图通常与MeshStandardMaterial或MeshPhongMaterial一起使用，以提供更真实的光照效果。
-
凹凸贴图（Bump Mapping） ：
- 原理：凹凸贴图通过改变模型表面的法线方向来模拟细节。它使用一张灰度图像来存储每个像素的高度信息，这些高度信息用于计算表面的法线方向。
- 效果：凹凸贴图可以为模型表面添加一些简单的凹凸效果，但它不能像法线贴图那样提供高频率的细节。
- 使用：凹凸贴图通常与MeshBasicMaterial或MeshLambertMaterial一起使用，因为这些材质不支持法线贴图。
-
总的来说，法线贴图比凹凸贴图更强大，因为它可以提供更真实的细节和光照效果。但是，法线贴图的计算量也比凹凸贴图大，因此在性能受限的情况下，可能需要使用凹凸贴图来替代。
Texture 纹理
纹理重复方式
texture.wrapS 和 texture.wrapT 属性用于控制纹理在水平（S）和垂直（T）方向上的重复方式。这两个属性可以取以下几种值：
THREE.ClampToEdgeWrapping：纹理在边缘处被夹紧，不会重复。这是默认值。THREE.RepeatWrapping：纹理在水平和垂直方向上重复。THREE.MirroredRepeatWrapping：纹理在水平和垂直方向上重复，但在每个重复的边界处镜像。
.flipY : Boolean
如果设置为true，纹理在上传到GPU的时候会进行纵向的翻转。默认值为true。
