Math 遵循样条线路径的Three.JS对象-旋转/tanget问题&；恒速问题

我认为我的问题类似于：但我无法正确访问JSFIDLE，我很难理解解释的第二部分

基本上，我创建了这个jsfiddle：它演示了一个简单的立方体，它沿着使用

SplineCurve3

的样条线创建的路径。使用标准轨迹球鼠标交互进行导航

沿路径定位立方体很简单。不过，我有两个问题

首先，我使用的是

样条曲线。getTanget（t）

其中

t

是沿路径旋转立方体的位置（仅Y轴向上）。我想我遗漏了一些东西，因为即使我提取了所提供的结果切线的

.y

属性，旋转看起来仍然不正确。是否有一些游牧化需要做

第二，路径上的速度变化很大，显然在创建更紧密的曲线时会堆积更多的点，但我想知道是否有办法重构路径以更均匀地分布点之间的空间？我遇到了

reparametrizebyraclength

函数，但很难找到如何使用它的解释

---

任何关于一个数学假人的帮助或解释，我们都将不胜感激。

为了保持恒定的速度，您可以使用

.getPointAt（t）

而不是

.getPoint（t）

要使长方体保持与曲线相切，请遵循与的答案中解释的相同逻辑

编辑：更新的小提琴：

---

three.js r.88

太棒了。我很欣赏小提琴，因为它让我看到了这一点，并以这种方式学习。非常感谢你。谢谢你的回答和小提琴，如果你原谅我的双关语，我发现它很容易理解；-）。迫不及待地想把这个应用到我的孩子们的游戏创意中去，无论是火车轨道还是过山车，这个都能很好地发挥作用。再次感谢。@WestLangley根据这个出色的答案，我已经成功地将其应用到我的项目中（在长时间休息后），但我有一个问题：当盒子到达第二个直线时，它们会翻转！有办法解决吗？对不起。您只需逐步完成代码并进行调试。警告：如果两个向量平行，则叉积定义不明确。你的火车轨道在X-Y平面上。确保您理解我的更改为什么有效。

    box.position.copy( spline.getPointAt(counter) );

    tangent = spline.getTangentAt(counter).normalize();

    axis.crossVectors( up, tangent ).normalize();

    var radians = Math.acos( up.dot( tangent ) );

    box.quaternion.setFromAxisAngle( axis, radians );