四元数与3D旋转实例！ Cocos Creator 3D Quternion !

最新推荐文章于 2023-08-29 09:11:31 发布

「已注销」

最新推荐文章于 2023-08-29 09:11:31 发布

阅读量4k

点赞数 5

文章标签： 3d java webgl 线性代数 slam

本文链接：https://blog.csdn.net/weixin_45686592/article/details/109269154

版权

本文通过实例探讨四元数在3D旋转中的应用，包括构造四元数、角色朝向、触摸旋转和绕轴旋转等，适合有一定3D知识基础的读者学习。

摘要由CSDN通过智能技术生成

用几个实用的例子带你理解四元数!文末获取完整项目！

前言

本文不会讲太多四元数公式的推导过程，重点讲讲几个接口的使用和个人理解。

阅读本文可能需要一些前置的知识（但不限于这些知识点）：

向量（内积外积/基本运算/几何意义）
坐标系（左手系/右手系/世界坐标/本地坐标）
矩阵（平移/旋转/缩放/模型矩阵/视图矩阵/投影矩阵）
视点和视线（视点/观察目标/上方向）

表示3D旋转一般采用三种方法：

矩阵
欧拉角
四元数

为什么使用四元数表示旋转呢？

平滑插值。(矩阵基本没有，欧拉角可以做插值，但可能遭遇万向锁的问题)
快速连接和角位移求逆。
能和矩阵快速转换。
仅用四个数。（矩阵9个，欧拉角3个）
难以理解，学会了看起来很牛逼。

当然四元数也有一些缺点：

四元数可能不合法。（一般通过四元数标准化解决这个问题，确保四元数为单位四元数）
对给定的方位的表达方式有两种方法，它们相互为负。（矩阵唯一，欧拉角有无数种）
相对难以使用。

实例

构造四元数

四元数的定义这边就不详细说了，大概知道就是用四个数字去表达旋转。

那么怎么去构造这个四元数呢？我们从API入手去讲解和理解。

旋转轴和旋转角

有了旋转轴和旋转角，就可以表示旋转了，那么四元数也可以通过这个构造出来。

/**
* @zh 根据旋转轴和旋转弧度计算四元数
*/
public static fromAxisAngle<Out extends IQuatLike, VecLike extends IVec3Like> (out: Out, axis: VecLike, rad: number) {
    rad = rad * 0.5; // 为什么要除以2？因为公式推导出来的！
    const s = Math.sin(rad);
    out.x = s * axis.x;
    out.y = s * axis.y;
    out.z = s * axis.z;
    out.w = Math.cos(rad);
    return out;
}