I am facing a unique challenge with an unusual bug and I'm looking for help from anyone who has encountered this issue before or can provide a solution.
My current project involves using Javascript to access the gyro on iOS devices, specifically focusing on rotation around the z-axis when the device is placed flat on a table.
The problem arises as the gyroscope appears to be consistently off by approximately 20 degrees for every full 360-degree rotation. For instance, if I align the device with a reference point on the table and rotate it 360 degrees, upon returning to its original position, the angle reading shows around 340 degrees instead of 360 or 0. This deviation becomes more pronounced over time, so after three complete rotations totaling 1080 degrees, the error accumulates to about 60 degrees. Interestingly, rotating in the opposite direction seems to correct the error, bringing the angle back to 0 after -1080 degrees.
I have tested this behavior on various devices such as iPad 2, 3, and iPhone 4, all yielding similar results despite slight variations (e.g., the iPhone showing an 8-degree discrepancy per 360-degree rotation). Even after attempting different libraries like gyro.js, the outcome remains consistent.
To showcase this issue, I've created a concise example on CodePen: http://codepen.io/CharlesSmart/pen/ZYNXEJ?editors=101
window.addEventListener('deviceorientation', orientationHandler, false);
function orientationHandler(e)
{
var alpha = e.alpha
var div = document.getElementById('text');
div.innerHTML = alpha;
}
I'm uncertain if my implementation of the orientation API is incorrect or if there's an underlying problem with the devices themselves. Any guidance or insights would be greatly appreciated.