Threejs ArrowHelper 或线条轮廓

Question

我想勾勒出使用 Three.js 框架中可用的 ArrowHelper 或 Line 几何图形绘制的箭头或线条。

问题是无法像 Stemkoski 的 this example 那样勾勒出复杂的对象或线条。

我找到了一种方法来找到我认为这两种情况的边界框最小值和最大值，我得到的参数如下：

var edgeBoundingBox = new THREE.Box3().setFromObject(element);

在线条的情况下，我为高度和宽度添加了一个间隙，否则边界框的高度和宽度为 0，并且无法看到。然后我可以创建 BoxGeometry 以最终使用 THREE.BackSide 网格创建轮廓效果。

但这并没有按预期工作，因为当添加到要勾勒的线条/箭头元素时，它没有获得正确的位置和旋转，并且必须采取一些技巧来使边界框处于与之前相同的位置和方向元素。

知道如何以更直接或更简洁的方式做到这一点吗？还有其他更好的技术吗？我做得对吗，但我应该从其他地方获得旋转和位置？

Answer 1

鉴于不能在所有情况下更改线宽属性（请参阅帖子 here），我提供了两种解决方案来勾勒您的线条或箭头，这可能有助于某些人寻找任何解决方案： 1）改变他们的颜色。 2) 像往常一样使用圆柱体而不是线和轮廓（我的意思是像Stemkoski example）。