Opengl es 四元数相机中的倾斜/滚动副作用

我正在尝试使用四元数在WebGL中实现摄影机。我使用了以下功能来旋转相机：

rotate: function(dx, dy, update) {

    // pitch
    if (dy != 0) {
        quat4.set([Math.sin(Render.degToRad(dy / 2.0)), 0, 0, 
                   Math.cos(Render.degToRad(dy / 2.0))], this.quatTemp);
        quat4.multiply(this.quatTemp, this.rotation, this.rotation);
    }

    // yaw
    if (dx != 0) {
        quat4.set([0, Math.sin(Render.degToRad(dx / 2.0)), 0, 
                   Math.cos(Render.degToRad(dx / 2.0))], this.quatTemp);
        quat4.multiply(this.rotation, this.quatTemp);
    }

    quat4.normalize(this.rotation);

    if(update == true)
        this.updateMatrix();

}

---

如果我禁用单轴旋转，它可以正常工作。然而，如果两者结合在一起，我会得到滚动/倾斜效果。我的世界上方向向量是[0,1,0]

问题是按乘法顺序出现的，以下更改修复了该问题：

if (dy != 0) {
    quat4.set([Math.sin(Render.degToRad(dy / 2.0)), 0, 0, 
               Math.cos(Render.degToRad(dy / 2.0))], this.quatTemp);
    quat4.multiply(this.rotation, this.quatTemp);
}

// yaw
if (dx != 0) {
    quat4.set([0, Math.sin(Render.degToRad(dx / 2.0)), 0, 
               Math.cos(Render.degToRad(dx / 2.0))], this.quatTemp);
    quat4.multiply(this.quatTemp, this.rotation, this.rotation);
}