Three.js自定义objLoader几何光照

Question

我有一个对象正在使用THREE.objLoader加载，然后像这样创建一个网格：

mesh = new THREE.SceneUtils.createMultiMaterialObject(
  geometry,
  [
    new THREE.MeshBasicMaterial({color: 0xFEC1EA}),
    new THREE.MeshBasicMaterial({
      color: 0x999999,
      wireframe: true,
      transparent: true,
      opacity: 0.85
    })
  ]
);

在我的场景中，我添加了一个DirectionalLight，它可以工作并且我能够看到我的物体，但是它就像是一个环境光一样。没有任何面的明暗变化。

物体填充了颜色，但是没有应用任何照明效果。 如果有人能帮助我解决这个问题，将不胜感激 :)

我可能漏掉了什么？ Jsfiddle链接: http://jsfiddle.net/5hcDs/

- daformat

Answer 1

大家好，感谢Maël Nison和mr doob的帮助，让我能够理解一些我不懂的东西，因为我是一个完全的3D新手... 我相信刚开始学习3D的人可能会觉得这个小结有用:

基本3D概念

• 一个3D面由一些点(顶点)和一个向量(称为法线)组成，指示面的方向(哪一面是正面，哪一面是背面)。

• 没有法线可能会非常糟糕，因为默认情况下只对正面应用照明。因此，当尝试应用LambertMaterial或PhongMaterial时，会出现黑色模型。

• OBJ文件是描述3D信息的一种方式。想要更多信息吗？阅读这篇维基百科文章。此外，法国页面提供了一个立方体示例，可以用于测试。

Three.js技巧和窍门

• 当没有法线存在时，无法应用照明，因此出现黑色模型渲染。Three.js实际上可以使用geometry.computeVertexNormals()和/或geometry.computeFaceNormals()计算顶点和面的法线。

• 当你这样做时，Three.js的法线计算可能会出错，导致法线翻转。为了解决这个问题，你可以简单地通过循环遍历你的几何体的面数组来解决:

/* Compute normals */
geometry.computeFaceNormals();
geometry.computeVertexNormals();

/* Next 3 lines seems not to be mandatory */
mesh.geometry.dynamic = true
mesh.geometry.__dirtyVertices = true;
mesh.geometry.__dirtyNormals = true;

mesh.flipSided = true;
mesh.doubleSided = true;

/* Flip normals*/               
for(var i = 0; i<mesh.geometry.faces.length; i++) {
  mesh.geometry.faces[i].normal.x = -1*mesh.geometry.faces[i].normal.x;
  mesh.geometry.faces[i].normal.y = -1*mesh.geometry.faces[i].normal.y;
  mesh.geometry.faces[i].normal.z = -1*mesh.geometry.faces[i].normal.z;
}

- daformat

Answer 2

你需要使用MeshPhongMaterial。 MeshBasicMaterial在计算片段颜色时不考虑光照。

然而，当使用MeshPhongMaterial时，你的网格会变成黑色。我从未使用OBJ加载器，但你确定你的模型法线正确吗？

另外：你可能想使用PointLight。它的位置可能应该设置为相机位置（light.position = camera.position应该可以解决问题，因为它允许光在相机位置由控件编辑时移动）。

- Maël Nison

---

非常感谢您，我将检查生成的OBJ文件中法线是否正确。 - daformat

你的几何模型没有法向量。你需要执行 geometry.computeFaceNormals() 和 geometry.computeVertexNormals()。除此之外，我建议尝试使用 MeshLambertMaterial 材质，而不是直接使用 MeshPhongMaterial。 - mrdoob

嘿，mrdoob！你总是关注着你的“宝贝”上发生了什么 :) 感谢你的建议。编辑完成后会通知您。 - daformat