가상 현실 또는 증강 현실 웹 앱을 개발하는 개발자는 DeviceOrientationEvent에 익숙할 것입니다.
초보자를 위해 '이쪽 끝: 기기 방향 사용'에서는 deviceorientation 이벤트 리스너가 기기의 비틀림과 회전에 응답하는 방법을 간략하게 설명합니다.
이전 버전의 Chrome에서는 DeviceOrientationEvent에 포함된 alpha, beta, gamma 값이 지구의 좌표 프레임을 기준으로 absolute도 단위로 제공되었습니다. 절대 각도를 제공하려면 기기의 자기계 센서를 사용하여 지구의 자기장을 감지해야 하며, 이는 근처의 자기장 변동에 영향을 받아 측정값이 틀릴 수 있습니다. 실제로는 기기 자체가 실제로 움직이지 않더라도 근처 자석으로 인해 웹 앱이 여러 개의 DeviceOrientationEvent를 등록할 수 있습니다. 방향 변경 추적에만 관심이 있는 가상 현실 애플리케이션의 경우 이 자기 노이즈는 좋지 않은 소식입니다.
변경사항
Chrome 50부터 DeviceOrientationEvent에 포함된 도수는 기본적으로 지구의 좌표 프레임과 관련하여 더 이상 절대값이 아닙니다. 즉, DeviceOrientationEvent는 기기의 가속도계와 자이로스코프의 조합으로 감지된 실제 움직임이 있을 때만 트리거되어야 합니다. 자기계와 자기장 변동으로 인한 잘못된 판독값은 고려되지 않습니다.
하지만 절대 각도가 필요합니다.
실제 세계에 직접 매핑해야 하는 증강 현실 웹 애플리케이션의 일부로 절대도를 사용해야 하는 JavaScript를 작성하는 경우에도 방법이 있습니다. 기기의 마그네토미터에 종속된 이전 동작은 새 deviceorientationabsolute 이벤트를 통해 사용할 수 있습니다.
개발자의 관점에서는 기존 DeviceOrientationEvent와 유사하며 absolute 속성이 true로 설정됩니다.
지원되는 항목 감지
절대 각도를 선호하는 개발자는 기능 감지를 사용하여 새 DeviceOrientationAbsoluteEvent 이벤트를 지원하는 브라우저를 사용 중인지 확인할 수 있습니다.
if ('ondeviceorientationabsolute' in window) {
// We can listen for the new deviceorientationabsolute event.
} else if ('ondeviceorientation' in window) {
// We can still listen for deviceorientation events.
// The `absolute` property of the event tells us whether
// or not the degrees are absolute.
}
교차 브라우저 호환성
DeviceOrientationEvent에 보고된 값은 일관되지 않았습니다.
iOS의 Safari 및 Firefox는 Chrome 50에서 도입된 구현 변경사항과 일치하는 상대 값을 사용합니다. 이렇게 변경하면 iOS를 염두에 두고 작성된 웹 애플리케이션과의 일관성이 높아집니다.
Firefox (iOS 이외의 플랫폼), Edge, Chrome 버전 50 미만은 적절한 센서가 있는 기기에서 실행될 때 DeviceOrientationEvent의 절대 각도 값을 사용합니다.
이 글을 작성하는 시점에서 Chrome 50은 새 DeviceOrientationAbsoluteEvent를 지원하는 첫 번째 브라우저입니다.
DeviceMotionEvent를 사용한 고급 방향 추적
DeviceOrientationEvent 사용의 몇 가지 단점과 DeviceMotionEvent를 사용하여 맞춤 센서 융합을 구현하는 방법을 자세히 설명하는 보리스 스무스의 상세한 도움말을 참고하세요.
가속도계와 자이로스코프에 대한 하위 수준 액세스를 제공하며 사용자에게 더 정확한 가상 현실 환경을 제공할 수 있습니다.