Device Orientation

기기의 물리적 움직임 감지

Device Orientation 및 Device Motion API는 스마트폰이나 태블릿 내부의 자이로스코프, 가속도계 센서 데이터를 웹 브라우저에서 직접 읽어올 수 있게 합니다.

이를 통해 기기의 3차원 기울기(알파, 베타, 감마 각도)나 이동 가속도 정보를 실시간으로 파악하여, 모바일 VR(가상현실) 콘텐츠, 기기를 기울여 조작하는 브라우저 게임, 파노라마 이미지 뷰어 등을 웹으로 구현할 수 있습니다. 센서 데이터는 사용자의 물리적 환경 정보를 담고 있으므로 최근에는 명시적인 사용자 권한 승인 및 HTTPS 연결이 강제되는 추세입니다.

[그림 1] 스마트폰의 3D 공간 상의 물리적 회전 및 가속도 측정

1. 스마트폰의 3축 방향 (Alpha, Beta, Gamma)

디바이스의 방향을 정의하는 세 가지 핵심 축(X, Y, Z)에 대한 구조도입니다.

2. Device Orientation API (방향/기울기)

deviceorientation 이벤트는 기기의 물리적인 방향(각도) 변화를 반환합니다.

속성 (event.*)	설명
`alpha`	Z축을 기준으로 한 수평 회전 각도 (0 ~ 360). 0은 보통 지구의 북극점을 가리킵니다.
`beta`	X축을 기준으로 한 앞뒤 기울임 각도 (-180 ~ 180). 앞(화면)으로 숙이면 양수입니다.
`gamma`	Y축을 기준으로 한 좌우 기울임 각도 (-90 ~ 90). 우측으로 기울이면 양수입니다.
`absolute`	제공된 방향 데이터가 지구 좌표계(나침반)와 절대적으로 일치하는지(true) 기기 임의 기준선인지(false) 나타냅니다.

3. Device Motion API (가속도/회전 속도)

devicemotion 이벤트는 기기가 이동하거나 회전할 때 발생하는 가속도 정보를 반환합니다.

속성 (event.*)	설명
`acceleration`	중력을 제외한 순수 기기의 가속도 (x, y, z 속성 보유). 단위: `m/s²`
`accelerationIncludingGravity`	중력 가속도(9.81m/s²)를 포함한 가속도 (x, y, z). 자이로스코프가 없는 기기에서도 지원됩니다.
`rotationRate`	각 축(alpha, beta, gamma)을 중심으로 기기가 회전하는 속도. 단위: `도/초 (deg/s)`
`interval`	이벤트가 발생하는 시간 간격 (밀리초). 디바이스의 센서 스펙에 따라 다릅니다.

보안 및 권한 주의사항 (iOS 13+)

최신 iOS 기기(Safari)에서는 개인정보 보호를 위해 사용자의 명시적인 승인 없이 센서 데이터 접근이 차단됩니다. DeviceOrientationEvent.requestPermission() 메서드를 사용해 버튼 클릭과 같은 명시적 사용자 상호작용 내에서 권한을 먼저 요청해야 합니다. 또한 이 API는 기본적으로 HTTPS 환경에서만 동작합니다.