開發虛擬或擴增實境網頁應用程式的開發人員對 DeviceOrientationEvent
已有相當熟悉的認識,針對初始的初始狀態,「This End Up: Use 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 概念撰寫的網頁應用程式更一致性。
如果是 iOS 50 之前的平台、Edge 和 Chrome 版本,在具備適當感應器的裝置上執行時,Firefox 會使用 DeviceOrientationEvent
的絕對度值。
截至本文所述,Chrome 50 是第一個支援新版 DeviceOrientationAbsoluteEvent
的瀏覽器。
使用 DeviceMotionEvent 進行進階方向追蹤
Boris Smus 提供詳細說明文章,詳細說明瞭使用 DeviceOrientationEvent
的部分缺點,以及如何使用 DeviceMotionEvent
實作自訂感應器融合。它們提供低階的加速計和陀螺儀存取權,可為使用者提供更準確的虛擬實境體驗。