THREEJS v0.87.1：不能再生成用于法线映射的切线和副法线

Question

我正在尝试在 ThreeJS 片段着色器中实现法线贴图，但似乎在最近的版本中丢失了一个关键功能 computeTangents。

这是一个使用旧版本 Three 的工作演示：

http://coryg89.github.io/technical/2013/06/01/photorealistic-3d-moon-demo-in-webgl-and-javascript/

ThreeJS 正在使用computeTangents() 向发送到着色器的顶点添加一个名为“切线”的属性。

所以我尽可能多地研究并尝试使用仅着色器的方法来计算切线，但这需要dFdx，这会导致我的 Macbook Pro 上的着色器中出现关于 GL_OES_standard_derivatives 的错误。

然后我尝试将几何从简单的立方体转换为缓冲区几何以用于BufferGeometryUtils.computeTangent() 函数，以便在那里生成切线，但这需要“索引几何”，这在创建的基本地理中不存在由ThreeJS。

从原始演示中，这是我需要使用最新的 ThreeJS 重新创建的行：

 var mesh = new THREE.Mesh(geo, mat);
 mesh.geometry.computeTangents();

在这里回购：

https://github.com/CoryG89/MoonDemo

是否有可能使用新版本的 Three 让这个演示工作？

Answer 1

我找到了答案。对于上面的演示，它需要将 THREE.SphereGeometry 更改为 THREE.SphereBufferGeometry。

 var geo = new THREE.SphereBufferGeometry(radius, xSegments, ySegments);

然后我必须添加 BufferGeometryUtils.js 文件并使用以下代码：

THREE.BufferGeometryUtils.computeTangents( geo );

这让演示再次运行。