Исправление нерегулярности события в iOS Safari Javascript?

Question

Я использовал "deviceorientation" для своего проекта, и при тестировании на iPhone / iPad он работает нормально в ландшафтном режиме, но имеет неравномерность в портретном режиме.

Вот шаги, чтобы повторить:

• Откройте этот JSFiddle на вашем iPad/iPhone в портретном режиме -

• Перемещайте устройство так, как будто вы смотрите в камеру и поворачиваетесь от взгляда к вашим ногам, к взгляду на горизонт, к взгляду на небо

• event.beta будет идти от 0 -> +/-90 -> 0

• Обратите внимание, как event.gamma прыгает, когда устройство достигает горизонта, вокруг, когда event.beta = 90

Q1: Как я могу настроить это поведение?

Q2: Есть ли способ получить определенное значение (например, 0-180) для движения в этом направлении от земли к небу?

HTML

<b>e.alpha :</b> <span id='alpha'></span><br/>
<b>e.beta :</b> <span id='beta'></span><br/>
<b>e.gamma :</b> <span id='gamma'></span><br/>

JS

function deviceOrientationHandler(e){

  var a = document.getElementById('alpha');
  var b = document.getElementById('beta');
  var g = document.getElementById('gamma');

  a.innerText = e.alpha;
  b.innerText = e.beta;
  g.innerText = e.gamma;
}

if (window.DeviceOrientationEvent) {

  window.addEventListener('deviceorientation', deviceOrientationHandler, false);

}else{

  console.error('Device orientation not supported in this browser.');
}

Answer 1

Значения альфа, бета и гамма при объединении создают вектор направления, который указывает, в каком направлении "указывает" устройство.

В вашем примере, когда event.beta значение превышает +/-90 градусов, затем event.alpha значение будет инвертировать себя. event.alpha это заголовок устройства, указывающий на верхнюю часть экрана, поэтому заголовок устройства переворачивается при достижении горизонта. когда event.alpha инвертирует, тогда другая инверсия угла ДОЛЖНА быть одновременно применена к одному из других углов, чтобы вектор направления продолжал указывать в правильном направлении.

Давайте используем проработанный пример и скажем, что наша стартовая ориентация устройства {alpha: 270, beta: 89.9, gamma: 0}, Мы можем определить вектор направления, сначала вращая вокруг alpha значение, то beta значение и, наконец, gamma значение. Если я теперь поверну свое устройство над горизонтом в соответствии с инструкциями, которые вы предоставили выше, то курс устройства изменится с 270 градусов на 90 градусов.

В этой новой ориентации данные не могут быть {alpha: 90, beta: 89.9, gamma: 0} потому что, если мы используем эти значения для определения вектора направления (так же, как мы делали выше), мы заметим, что вектор направления теперь указывает в направлении, противоположном тому, где он должен быть. Таким образом, реализации выполняют одновременный переворот другой оси, чтобы учесть этот переворот одной оси, чтобы гарантировать, что вектор направления продолжает "указывать" в правильном направлении.

Таким образом, реализация iOS устанавливает данные в этой новой ориентации {alpha: 90, beta: 89.9, gamma: 180} и затем вектор направления продолжает указывать в правильном направлении.

Это причина, по которой вы наблюдали переворот event.gamma ценность и это правильное поведение, а не неровность.

Answer 2

Это проблема "блокировки карданного подвеса" углов Эйлера. Это происходит, когда два из вращающихся колец становятся слишком близкими по углу (в данном случае гамма и альфа), гироскоп возвращает значение в углах Эйлера, в некоторых ситуациях, хотя данные трехмерного азимута остаются относительно правильными, одна единственная гамма может отойти далеко, и он вернется на другую ось, поэтому вы обнаружите, что гамма и альфа изменяются одновременно, но их сумма остается неизменной.

Один из способов решить эту проблему - создать вектор и установить порядок вращения, аналогичный гироскопу, отследить вектор и избавиться от ненужных размеров, таким образом, вы получите правильную гамму.

идея заключается не просто в том, чтобы сосредоточиться на самой гамме, ведь данные в 3D не ошибаются, форма представления вызывает проблему, вы вряд ли можете пропустить или изменить форму возврата DeviceOrienationEvent, остался только один способ - пересчитать правильное значение в отношении двух других измерений.

прости мой плохой английский, надежда может помочь тебе.