Three.js 在点击事件后沿路径移动相机

Question

在过去的...很多小时里，我尝试、搜索并阅读了如何让相机沿着 Three.js 中的路径移动。我似乎找不到它，或者我已经饱和了，看不到答案，即使它咬了我的脸。

我想要的并不难。我在 3D 空间中有几个类似图标的东西，我希望能够点击它们。我有它的 THREEx 扩展，所以这部分很好。现在相机沿着预定路径平滑移动的部分，连同它的lookAt Y轴，使其面向下一个“图标”。

我的第一种方法是使用贝塞尔曲线创建一条路径，并找出如何使其中一条呈螺旋形略微向上移动，然后找出如何在点击事件后沿该路径为相机设置动画。我仍然坚持 - 很难 - 试图找出如何制作一条向上弯曲的简单路径，更不用说之后令人生畏的部分了。

我是否走在正确的轨道上？如果是这样，我该如何制作这样的路径？或者我应该只制作一条常规的贝塞尔曲线并旋转和编辑它，直到它适合我的需要？最后，我如何让相机以（短）动画、流畅的动作跟随路径？

提前致谢！

Answer 1

看看这个链接：http://cubic.org/docs/hermite.htm

它解释了曲线计算，包括您需要注意的变化。例如，贝塞尔曲线对于动画来说不是一条好的曲线，因为它不会将点放在彼此相距较远的地方，从而导致相机的速度发生意外变化。

在链接中，讨论从一个退出数学解释器开始，提供伪代码，然后展示如何推导出几种流行类型的曲线，这些曲线具有相同的初始数学变体。这继续到 TCB：张力、连续性和偏置曲线，它为您提供了您想要在相机上进行的良好控制类型。