three.js 填充边缘之间的间隙
three.js filling gaps between edges
我在 Blender 中创建了一个带有孔的方块模型：
我将其导出为 .obj 文件，然后使用 OBJLoader 插件将其导入 ThreeJS。
当我在我的应用程序中使用它时，它似乎在孔的两侧画了一张脸：
我需要在 ThreeJS 中使用一个设置来避免像这样关闭间隙吗？或者是我如何创建模型的问题？我完全迷失在这里，任何指导表示赞赏。
编辑：我通过反复试验发现问题在于面孔形状不规则，例如与孔相邻的面孔。我 "solved" 我的问题是对模型进行三角剖分；虽然这稍微改变了它的形状，但它确保孔中的每个顶点都是三角形面的一部分，这似乎是神奇的答案。
我还是很好奇为什么会这样，特别是因为三角剖分让盒子的角有点奇怪。
编辑 2：抱歉耽搁了。这是搅拌机文件：https://gofile.io/?c=EoxH1r
您遇到的问题是因为 ngons（多于 4 条边的多边形）。
three.js建模就像游戏建模一样，所以最好避免多边形超过 4 个边，因为当渲染器（或视频卡，我不知道）尝试渲染模型时，它必须应用三角测量并且可能以意想不到的方式进行。
正如您所说，对模型应用三角测量解决了这个问题，但在您的建模应用程序中自动应用三角测量也可能会产生意想不到的结果。因此，最好的办法是更改模型，以便获得预期的结果。
这是我发现的一个 youtube 视频，它似乎解释了很多关于 ngons 的内容。
https://www.youtube.com/watch?v=BjnCV2PIkKA
（虽然我只看了第一分钟左右）
这是我将如何做的一个例子，红线代表添加的边。记得在两边都这样做，并在导出前应用平滑组。
我在 Blender 中创建了一个带有孔的方块模型：
我将其导出为 .obj 文件，然后使用 OBJLoader 插件将其导入 ThreeJS。
当我在我的应用程序中使用它时，它似乎在孔的两侧画了一张脸：
我需要在 ThreeJS 中使用一个设置来避免像这样关闭间隙吗？或者是我如何创建模型的问题？我完全迷失在这里，任何指导表示赞赏。
编辑：我通过反复试验发现问题在于面孔形状不规则，例如与孔相邻的面孔。我 "solved" 我的问题是对模型进行三角剖分；虽然这稍微改变了它的形状，但它确保孔中的每个顶点都是三角形面的一部分，这似乎是神奇的答案。
我还是很好奇为什么会这样，特别是因为三角剖分让盒子的角有点奇怪。
编辑 2：抱歉耽搁了。这是搅拌机文件：https://gofile.io/?c=EoxH1r
您遇到的问题是因为 ngons（多于 4 条边的多边形）。
three.js建模就像游戏建模一样，所以最好避免多边形超过 4 个边，因为当渲染器（或视频卡，我不知道）尝试渲染模型时，它必须应用三角测量并且可能以意想不到的方式进行。
正如您所说，对模型应用三角测量解决了这个问题，但在您的建模应用程序中自动应用三角测量也可能会产生意想不到的结果。因此，最好的办法是更改模型，以便获得预期的结果。
这是我发现的一个 youtube 视频，它似乎解释了很多关于 ngons 的内容。
https://www.youtube.com/watch?v=BjnCV2PIkKA
（虽然我只看了第一分钟左右）
这是我将如何做的一个例子，红线代表添加的边。记得在两边都这样做，并在导出前应用平滑组。