У кого есть опыт DeviceOrientationEvent и телефон/планшет под рукой?
Выполняя следующие фрагменты кода на устройстве с гироскопом, я заметил, что гамма (вращение влево/вправо вдоль оси Y) становится большой и непредсказуемой, когда бета приближается к 90 градусам (устройство направлено прямо вверх). Я предполагаю, что это карданный замок.
var data, raf, alpha = document.getElementById("alpha"),
beta = document.getElementById("beta"),
gamma = document.getElementById("gamma");
window.addEventListener("deviceorientation", processData);
window.addEventListener('click', togglePause);
updateText();
function processData(e) {
data = e;
}
function updateText() {
if (data) {
alpha.textContent = Math.round(data.alpha);
beta.textContent = Math.round(data.beta);
gamma.textContent = Math.round(data.gamma);
}
raf = requestAnimationFrame(updateText);
}
function togglePause(e) {
if (raf) {
cancelAnimationFrame(raf);
raf = null;
window.removeEventListener("deviceorientation", processData);
} else {
window.addEventListener("deviceorientation", processData);
raf = requestAnimationFrame(updateText);
}
}body {
font: normal 30px/200% sans-serif;
margin: 20px;
cursor: default;
}
span {
font-size: 50px;
vertical-align: middle;
}<body>
alpha: <span id="alpha">null</span>
<br>beta: <span id="beta">null</span>
<br>gamma: <span id="gamma">null</span>
<br>[tap to pause/resume]
</body>https://jsfiddle.net/1us8p1ad/show
Мой вопрос: как я могу предсказуемо отслеживать левую/правую ориентацию устройства с помощью гаммы? Гамма - единственное значение, которое меня волнует - 3D-пространство не требуется.
Я изучал использование матрицы вращения и кватерниона, как обсуждалось здесь, но не получение достоверных результатов. Фактически, примеры на странице автора на github также ломаются, когда бета-версия достигает 90 градусов! То же самое с этим руководством по MDN — проверьте его на своем устройстве: когда это прямо вверх, мяч сходит с ума. Как эти отклонения остались незамеченными!
