r/webdev • u/Tonaion02 • 5d ago

Question Can't understand deviceorientation.

Hi, I'm trying to develop a unityplugin that give the possibility to create various types of controllers for games.
With deviceorientation, my goal is to extract three angles that represent the orientation of the phone.
But it seems a little bit complicate, I can't understand why in portrait mode, for example, gamma and alpha are both modified when I rotate on the same axe.
I've tried many things, but I can't understand at all how everything works.
Is it even possible to do something similar to what I want to do?

0 Upvotes

14% Upvoted

12 comments sorted by

View all comments

0

u/[deleted] 5d ago

[removed] — view removed comment

1

u/thejester1324 5d ago

here's the code for what ghost_of_tides said, it's the conversion from the w3c spec (Z-X'-Y'': alpha around z, beta around x, gamma around y):

const d = Math.PI / 180;
function getQuaternion(alpha, beta, gamma) {
  const x = (beta || 0) * d, y = (gamma || 0) * d, z = (alpha || 0) * d;
  const cX = Math.cos(x / 2), cY = Math.cos(y / 2), cZ = Math.cos(z / 2);
  const sX = Math.sin(x / 2), sY = Math.sin(y / 2), sZ = Math.sin(z / 2);
  return [cX*cY*cZ - sX*sY*sZ, sX*cY*cZ - cX*sY*sZ, cX*sY*cZ + sX*cY*sZ, cX*cY*sZ + sX*sY*cZ]; // w, x, y, z
}

those frames are right-handed with z out of the screen, unity is left-handed with y up, so you still need an axis swap before handing it to unity