Three.js 画布渲染器多边形之间的接缝线问题

Question

我已经对这个库感到足够舒适了，但是这个让我感到疲惫：

当我尝试简单地渲染一个没有任何纹理的网格，从Blender导出为.obj（三角化，启用平滑组），WebGL渲染器可以完美地完成，但我也需要使用canvas渲染器，这就出现了问题；多边形边缘之间有接缝，并且部分可见

只是为了清楚起见，提供截图

WebGL渲染器 https://www.monosnap.com/image/OVaQO8yLDU9Wl6ufhADDVCEWg

Canvas渲染器 https://www.monosnap.com/image/1AYeyHjWkGx9fQ6vg6xLr0EcV

网格相当复杂，约7k个三角形

- VintLucky777

---

你能提供一个你的代码的实时示例吗？ - WestLangley

当然，给你。 http://mt-arms.com/aktuning - VintLucky777

Answer 1

使用CanvasRenderer时，您需要进行设置。

material.overdraw = 0.5; // or some number between 0 and 1

这将有助于缓解问题。

注意：`overdraw` 曾经是一个布尔型，现在是一个浮点型。

three.js 版本号为 r.63。

- WestLangley

---

这个不起作用，仍然有接缝。加载器代码： loader2.load( 'models/cevje.obj', function(object) { object.material = new THREE.MeshLambertMaterial({color:0xffffff, shading:THREE.FlatShading, overdraw:0.5}); sceneobjectparent2.add(object); });``` - VintLucky777

<链接> - VintLucky777

你正在使用的是 three.js 版本 r.63 吗？ - WestLangley

我之前使用的是r62版本，更新到r63后没有任何变化。 - VintLucky777

你正在将Lambert材质分配给加载的对象，而不是对象的子网格。请执行以下操作：object.children[0].material.overdraw = 0.5; - WestLangley

现在这个几乎解决了问题，除了部分半透明的多边形 - 但这必须是画布 z 排序的问题。谢谢！ - VintLucky777