가상 또는 증강 현실 웹 앱을 개발하는 개발자라면 의심의 여지 없이 DeviceOrientationEvent에 익숙합니다.
아직 시작하지 않은 'This End Up: Using Device Orientation'은 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를 염두에 두고 작성된 웹 애플리케이션과의 일관성이 더욱 향상될 것입니다.
50 이전의 Firefox, Edge, Chrome 버전은 적절한 센서가 있는 기기에서 실행될 때 DeviceOrientationEvent의 절대 각도 값을 사용합니다.
이 문서를 작성하는 시점 기준으로 Chrome 50은 새로운 DeviceOrientationAbsoluteEvent를 지원하는 첫 번째 브라우저입니다.
DeviceMotionEvent를 사용한 고급 방향 추적
Boris Smus는 DeviceOrientationEvent 사용의 몇 가지 단점과 DeviceMotionEvent를 사용하여 맞춤형 센서 퓨전을 구현하는 방법을 자세히 설명한 매우 자세한 도움말을 참조하세요.
가속도계와 자이로스코프에 대한 낮은 수준의 액세스를 제공하며 사용자에게 더 정확한 가상 현실 환경을 제공할 수 있습니다.