How to calculate difference between two spatial rotations

342 Views Asked by At

I'm trying to convert physical orientation of a mobile device got from deviceorientation event to a series of camera rotations in my sort of 3D viewer. The problem is that I need to do spatial rotation relative to the first orientation taken from deviceorientation i.e. the orientation on page load. So I need to save the first orientation and then somehow do spatial rotation corresponding to orientation change from the saved one to the current.

How do I do that?

Note that I use glMatrix's quaternions to do spatial rotation but I'm not quite familiar with this topic.

Currently my rotation function looks like this:

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);
    ...
}

And my deviceorientation listener looks like this (sure it's not finished yet):

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);
});

I guess that it's quite hard to find explicit formula to get needed angles (aX, aY, aZ). I guess that I need to do quaternion transformations instead but I don't know how exactly.

0

There are 0 best solutions below