差不多Three.js的差不多分享系列（二）

[qugemingzizhenmafan]

OrbitControls

重要常用的控制器，一般我们会有环绕观测模型的需求，有两种方式实现，一是旋转物体，二是相机环绕物体。 一般是选择第二种方式。 因为，scene场景有众多数量物体的情况下，旋转物体并不方便，实际意义上看，要环绕观测一个无法轻易移动的物体，也是移动观测视角。 OrbitControls是一个插件，通过鼠标键盘等操作，控制相机的位置。

预览链接：https://threejs.org/examples/?q=control#misc_controls_orbit 还有个控制物体的控制器TransformControls，https://threejs.org/examples/?q=control#misc_controls_transform

[qugemingzizhenmafan]

模型 和 加载器loader

模型常用格式gltf、glb、fbx GLTFLoader：用来加载gltf、glb格式的3D模型 FBXLoader：用来加载fbx格式的3D模型 一般用法，new一个类的实例后，调用load方法，传入一个回调函数，参数就是解析后的模型对象，一般把它加到scene场景里面，或者对其进行一些操作。

[qugemingzizhenmafan]

材质

fbx模型的材质

只会被转成两种threejs里面的材质。 MeshLambertMaterial，http://www.yanhuangxueyuan.com/threejs/docs/index.html#api/zh/materials/MeshLambertMaterial MeshPhongMaterial，http://www.yanhuangxueyuan.com/threejs/docs/index.html#api/zh/materials/MeshPhongMaterial

但不是效果更好的PBR材质，基于物理的渲染（PBR）最近已成为许多3D应用程序的标准，例如Unity， Unreal和 3D Studio Max。

gltf/glb模型的材质

PBR材质，MeshStandardMaterial，http://www.yanhuangxueyuan.com/threejs/docs/index.html#api/zh/materials/MeshStandardMaterial

自由度更高的材质

着色器材质ShaderMaterial，http://www.yanhuangxueyuan.com/threejs/docs/index.html#api/zh/materials/ShaderMaterial 例如，菲涅尔材质就是使用这个材质，效果： https://blog.csdn.net/ewankiller/article/details/74312502 https://myspotifyglass.com/products/custom-spotify-night-light-with-7-colors-personalized-scannable-night-light-with-remote-control?variant=38555857879221

[qugemingzizhenmafan]

贴图

贴图是材质的内容，介绍用到过的几种 http://www.yanhuangxueyuan.com/threejs/docs/index.html#api/zh/materials/MeshStandardMaterial

贴图/颜色贴图/纹理贴图

.map : Texture 颜色贴图。默认为null。纹理贴图颜色由漫反射颜色.color调节。

法线贴图/凹凸贴图

效果表现为物体每个位置的凹凸程度 .normalMap : Texture 用于创建法线贴图的纹理。RGB值会影响每个像素片段的曲面法线，并更改颜色照亮的方式。法线贴图不会改变曲面的实际形状，只会改变光照。 .bumpMap : Texture 用于创建凹凸贴图的纹理。黑色和白色值映射到与光照相关的感知深度。凹凸实际上不会影响对象的几何形状，只影响光照。如果定义了法线贴图，则将忽略该贴图。

发光贴图

效果表现为物体每个位置的发光强度 .emissiveMap : Texture 设置放射（发光）贴图。默认值为null。放射贴图颜色由放射颜色和强度所调节。 如果你有一个放射贴图，请务必将放射颜色设置为黑色以外的其他颜色。