three.js 仅线框形状，隐藏边缘为虚线答案

【问题标题】：three.js wireframe only shape with hidden edges as dashed linesthree.js 仅线框形状，隐藏边缘为虚线
【发布时间】：2013-02-11 14:40:49
【问题描述】：

我正在尝试在 three.js 中创建特定类型的 3D 对象。例如，我想要一个处于线框模式的立方体（所以只显示边缘）。但我希望后面的边缘是虚线的。插图：

我不知道这对于three.js是否可行，或者我是否应该直接尝试使用webgl。我应该在线框中使用THREE.Mesh 还是使用THREE.Line 和LineDashedMaterial 或者两者都放在一起？

【问题讨论】：

【解决方案1】：

这是一个非常酷的想法。如上所述，我已在以下位置实现了您的答案：

如果有人想看到它的实际效果。

【讨论】：

这似乎不再起作用了。如果我理解正确，“可见”边缘应该是唯一显示的边缘（如实线），如果显示立方体的材质，将被覆盖的边缘应该显示为虚线。那是对的吗？在您的示例中，我看到一个实心立方体，有虚线和实线；但是，我只能看到正面，因为这些面是实心的。 three.js 有什么变化吗？或者这是否按预期呈现？鉴于 OPs 的问题，我认为这个例子（不再适用）。
另外，在浏览了您的一些演示后，我还注意到细分曲面修改器示例是......奇怪。从屏幕截图中，我认为这些都是同时起作用的。可能是三个.js 的问题？
链接已损坏。

【解决方案2】：

我设法做到了。您需要创建三个对象。

第一个对象：实体 3d 对象（我指的是面而不是边缘）

第二个对象：除了虚线之外的所有边

第三个对象：所有边缘，但正常（不是虚线）

对于第一个对象，将材质设置为color: false, side: THREE.DoubleSide, depthTest: true。

第二个对象材质：color: (whatever you like), depthTest: false。

第三个对象材质：color: (whatever you like), depthTest: true。

我还将所有材质设置为polygonOffset: true, polygonOffsetFactor: 1, polygonOffsetUnits: 1，以摆脱z-fighting。

【讨论】：