如何解决Three.js 中的相机旋转
我想 3D 计算并不容易通过有关该主题的肤浅知识来弄清楚....:(
无论如何,我有一个像下面这样的场景,在位置 R 有一些物体,还有一个可能指向也可能不指向这些物体的相机。在某些时候,我必须围绕物体旋转相机,并且它必须与它们保持相同的角度。 (尽管我是 2D 绘图,但旋转实际上是 3D)
这是我旋转相机的方法(不确定这是最好的方法,但有效):
sphere = new Three.Spherical()
offset = new Three.Vector3()
offset.copy(camera.position).sub(R)
sphere.setFromVector3 offset
sphere.theta -= .......... the desired angles
sphere.phi -= .......... the desired angles
offset.setFromSpherical(sphere).add(R)
camera.position.copy(offset)
这里我也尝试根据上面的两个角度修改 camera.rotation
但还没有接近得到预期的解决方案,主要是因为我不知道如何使用带有 {{1} 的球面数据} 轮换使用。
解决方法
据我所知,您需要旋转相机,使其与圆形横截面相切(就像您在图像中看到的那样)。
如果相机的起点和终点位置是 A 和 B,圆的中点是 R。 所以,
圆N = crossVectors(A-R,R-B)
的法向量。
点 B
处的切向量是 T = crossVectors(R-B,N)
。
您可能需要检查向量的方向,以免看向其他方向。
然后要确定相机的方向,您可以将目标设置为 B+T
(如果使用 OrbitControls 或类似工具)或使用相机上的 lookAt
功能。
如果不是沿着切线,而是希望它与原始切线保持相同的偏移角度:
计算两个点 A and
B 的切线,将它们命名为 - T1
和 T2
。然后制作从 T1 到 T2 的四元数。 Q = new Quaternion().setFromUnitVectors(T1,T2).
现在将 Q
应用于相机旋转。 camera.quaternion.multiply(Q)
。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。