Question

我正在一个Three.js场景中，该场景在指向北，东，南和西的两条线的中心渲染一个立方体。我正在使用三个OrbitControls进行交互，并使用一些自定义代码（请参见下面的链接），以将摄像头围绕原点平稳地捕捉到预定义的位置（N，E，S，W和顶部）。

这很好，除了少数情况：

通过单击“北”按钮，然后单击“南”按钮，从北向南倾斜（东西向相同）。在向量A和向量B之间套扎失败，导致摄影机仅跳到向量B。
自定义轮播中的提示，例如单击“顶部”（Top）按钮，从NW到顶部视图。相机可以正确地沿y轴矢量进行矫正，但是由于无法控制其旋转，因此在完成矫正后它会捕捉到最终的相机旋转。

是否有更好的方法来处理摄像机从当前矢量到目标矢量的圆形路径上围绕原点的平滑过渡？这也适用于上述情况1和2。

这里是a link to my CodePen three.js scene so far。点击位置按钮后，我存储了目标向量，并使用以下代码行向目标方向移动

camera.position.lerp(cameraTarget, cameraLerpAlpha);

Answer 1

lerp不确定如何围绕该中心点进行轨道旋转。为了快速解决问题，请在第4-8行（或动画开始时）稍微偏移一下位置，以指示将其发送到以下位置：

$db = new PDO("pgsql:dbname=Horecami;host=127.0.0.1", "postgres", "1" );
$sql = 'Select horeca_user.update_token(?, ?, ?)';
$stmt = $db->prepare($sql);
$type=1;
$id=1;
$z='az';
$stmt->bindValue(1, $type, PDO::PARAM_INT);
$stmt->bindValue(2, $id, PDO::PARAM_INT);
$stmt->bindValue(3, $z, PDO::PARAM_STR);
$stmt->execute();
$res=$stmt->fetchAll();

但是，实际上，如果您不希望它到中心点的距离不被锁定，那么您需要查看此答案并使用四元数slerp而不是lerp：threejs: smoothly rotate camera towards an object

Three.js：平滑相机围绕原点

1 个答案: