I’ve started to clean up my device rotation script where I read in a phones alpha, beta and gamma values and map them to a target (camera) rotation. So far It’s working well, but I’ve also wanted to integrate optional offsets for x and y rotation.
See the project here, the script in question is “deviceRotation.js” at the “main” entity.
https://playcanvas.com/project/1100587/overview/mobile-sensor-framework
Given a calculated quaternion (based on the device rotation) I’ve first added the x-offset using a quaternion multiplication, using the following code:
var q3 = new pc.Quat();
q3.setFromEulerAngles(this.xOffset,0,0);
q0.mul(q3);
This also works fine, but I then wanted to integrate the yOffset as well, using a similar approach:
var q4 = new pc.Quat();
q4.setFromEulerAngles(0,this.yOffset,0);
q0.mul(q4);*/
This creates a weird camera rotation. I kinda got the thing working, applying the yOffset after I’ve applied the quaternion to the target.
this.target.setRotation(q0);
this.target.rotate(0,this.yOffset,0)
But shouldn’t both versions work, asuming they do exactly the same thing?
Thanks for any heads up.