javascript - 2 つの空間回転の差を計算する方法

Question

イベントから取得したモバイル デバイスの物理的な向きを、deviceorientation私の種類の 3D ビューアーで一連のカメラの回転に変換しようとしています。問題は、ページ読み込み時の方向から取得した最初の方向に対して空間的な回転を行う必要があることです。deviceorientationしたがって、最初の向きを保存してから、保存された向きから現在の向きへの向きの変更に対応する空間回転を何らかの形で行う必要があります。

それ、どうやったら出来るの？

glMatrixの四元数を使用して空間回転を行うことに注意してください。ただし、このトピックにはあまり詳しくありません。

現在、私の回転関数は次のようになっています。

function rotate(aX, aY, aZ) {
    var rotation = quat.create();
    quat.rotateX(rotation, rotation, aX);
    quat.rotateY(rotation, rotation, aY);
    quat.rotateZ(rotation, rotation, aZ);
    quat.normalize(rotation, rotation);
    ...
}

そして、私のdeviceorientationリスナーは次のようになります (まだ完成していないことを確認してください):

var aInitial = null;
window.addEventListener('deviceorientation', function (event) {
    var alpha = e.alpha, beta = e.beta, gamma = e.gamma;
    if (!aInitial) aInitial = [alpha, beta, gamma];
    // somehow get angles aX, aY, aZ from alpha, beta, gamma and aInitial
    rotate(aX, aY, aZ);
});

必要な角度 ( ) を取得するための明示的な式を見つけるのは非常に難しいと思いますaX, aY, aZ。代わりにクォータニオン変換を行う必要があると思いますが、正確な方法はわかりません。