THREE.js glTF 加载器（二进制）不显示顶点颜色？答案

【问题标题】：THREE.js glTF loader (binary) does not display vertex colors?THREE.js glTF 加载器（二进制）不显示顶点颜色？
【发布时间】：2021-03-23 21:01:34
【问题描述】：

我有一个带有预先计算的顶点颜色的模型。如果我生成 glTF 文件并使用 THREE.GLTFLoader 加载它，我可以调用 scene.overrideMaterial = new THREE.MeshBasicMaterial({vertexColors: THREE.VertexColors}) 将默认材质从 MeshStandardMaterial 转换为 MeshBasicMaterial。然后正确显示预先计算的颜色。

但是，如果我生成二进制 glTF (*.glb) 文件并覆盖材质属性，我必须调用 scene.add(new THREE.AmbientLight(0xffffff) 将环境光照添加到场景中；否则，显示为黑色。

这是 glTFLoader 的缺陷，还是我（更有可能）遗漏了什么？

【问题讨论】：

标签： gltf

【解决方案1】：

您的第一个示例（替换原始材质）以您期望的方式出现，因为THREE.MeshBasicMaterial 是一种无光照/无阴影材质类型。从three.js 文档中，它“不受灯光影响”，并且不需要灯光出现在屏幕上。

不替换材质时，THREE.GLTFLoader 创建的默认材质通常为THREE.MeshStandardMaterial，这是一种基于物理的渲染（PBR）材质。因为它是基于物理的，所以它需要光照才能出现在屏幕上。为获得最佳效果，尤其是使用金属材料时，您可能需要一个环境贴图来实现逼真的照明。

也可以创建一个默认包含无光照材质（或 THREE.MeshBasicMaterial）的 glTF 模型，但根据您描述的结果，这听起来不像您的 glTF 模型是这样创作的。

【讨论】：

谢谢你，唐。错误出现在格式错误的二进制 glTF 文件中，该文件是内部开发的，用于对具有烘焙纹理的对象进行建模。然而，这导致了一个相关的问题——如何在 glTF 文件中指定无光照材质？从 Khronos glTF 2.0 文件规范中根本不清楚。
是的——核心规范仅包含 PBR 材质，但广泛支持 Unlit 材质的扩展：github.com/KhronosGroup/glTF/blob/master/extensions/2.0/Khronos/…。一种快速的转换方法是这个 CLI 工具：gltf-transform.donmccurdy.com/cli.html。