修复自定义threejs胶囊几何体中的法线

Question

为了更多地了解three.js中的自定义几何体，我尝试调整Paul Bourke's capsule geometry example。

使用我的自定义胶囊几何体，我目前有两个问题：

1. 中间法线未正确定位。
2. 侧面有一个硬缝。 （编辑：通过故意计算面法线来修复。更新代码的要点）

也许还有一个问题一直困扰着我：

1. 在中间段中添加顶点循环可能是一般策略吗？

我对几何体一般都很满意，但是有人能够就如何解决这些问题给我一些指导吗？我觉得中间段的正常问题必须是面部的方向，这里是相关的面部构造片段：

  for(let i = 0; i <= N/2; i++){
    for(let j = 0; j < N; j++){
      let vec = new THREE.Vector4(
        i         * ( N + 1 ) +   j       ,
        i         * ( N + 1 ) + ( j + 1 ) ,
        ( i + 1 ) * ( N + 1 ) + ( j + 1 ) ,
        ( i + 1 ) * ( N + 1 ) +   j
      );

      let face_1 = new THREE.Face3(vec.x,vec.y,vec.z);
      let face_2 = new THREE.Face3(vec.x,vec.z,vec.w);

      geometry.faces.push(face_1);
      geometry.faces.push(face_2);
    }
  }

CapsuleGeometry.js

Answer 1

阴影/普通接缝就在那里，因为你可能已经在那里明确定义了硬边。

当您运行循环以生成顶点时，您可能会复制起始位置。如果从0开始，一直到2PI，0 == 2PI。当您编织三角形时，您可能告诉最小的一个使用2PI而不是0，即使它们处于相同的位置，就三角形而言，它们指向不同的顶点，因此没有连接。

for(let i = 0; i <= N/4; i++){ //change to i < N 
for(let j = 0; j <= N; j++){

如果你告诉循环中的最后一个三角形指向起始顶点，你将形成一个geometry.computeVertexNormals()可以平滑的连续曲面。

您也可以直接计算这些法线。在扩展它之前，可以从这些情况下从原始球体的顶点位置获得所有法线。