javascript - 沿轴旋转四元数

Question

我在 WebGL 上下文中得到了一个由四元数旋转的对象。现在我想根据当前鼠标位置绕 x 轴旋转它。我怎样才能做到这一点？我正在使用 glMatrix 库。

Answer 1

glMatrix(当前)不包含太多四元数变换的方式。对不起。不过，添加可能不是一个坏主意。

您可以在网上查找这些内容的一些引用资料。例如:this page有一些基本四元数数学的好例子。同时，如果您所寻找的只是围绕 X 旋转，我认为这会解决问题:(注意!前面未经测试的代码!这只是我链接的页面上算法的快速优化)

/**
 * Rotates a quaternion by the given angle around the X axis
 *
 * @param {quat4} quat quat4 to rotate
 * @param {number} angle Angle (in radians) to rotate
 * @param {quat4} [dest] quat4 receiving operation result. If not specified result is written to quat
 *
 * @returns {quat4} dest if specified, quat otherwise
 */
quat4.rotateX = function (quat, angle, dest) {
    if (!dest) { dest = quat; }

    // NOTE: I really have no idea what this is for, the guy on the linked page seemed to think it was necessary, though. 
    angle *= 0.5; 

    var qax = quat[0], qay = quat[1], qaz = quat[2], qaw = quat[3],
        qbx = Math.sin(angle), qbw = Math.cos(angle);

    dest[0] = qax * qbw + qaw * qbx;
    dest[1] = qay * qbw + qaz * qbx;
    dest[2] = qaz * qbw - qay * qbx;
    dest[3] = qaw * qbw - qax * qbx;
};

同时，请随时向 gl-matrix github page 添加问题请求您认为有帮助的任何操作。