Nhà phát triển làm việc trên các ứng dụng web thực tế ảo hoặc thực tế tăng cường chắc chắn sẽ quen thuộc với DeviceOrientationEvent.
Đối với những người mới làm quen, bài viết "Kết thúc: Sử dụng hướng thiết bị" cung cấp thông tin tổng quan tuyệt vời về cách trình nghe sự kiện deviceorientation có thể phản hồi khi thiết bị xoay và vặn.
Trong các phiên bản Chrome trước, các giá trị alpha, beta và gamma có trong DeviceOrientationEvent được cung cấp dưới dạng độ absolute so với khung toạ độ của Trái Đất. Để cung cấp độ tuyệt đối, bạn cần sử dụng cảm biến từ kế của thiết bị để phát hiện từ trường của Trái Đất. Điều này dễ bị ảnh hưởng bởi sự biến động của từ trường ở gần đó, có thể làm sai lệch kết quả đo. Trong thực tế, điều này có thể dẫn đến việc ứng dụng web đăng ký một loạt DeviceOrientationEvent do có nam châm ở gần, mặc dù bản thân thiết bị không thực sự di chuyển. Đối với một ứng dụng thực tế ảo chỉ quan tâm đến việc theo dõi các thay đổi về hướng, thì nhiễu từ trường này là một tin xấu.
Điều gì sẽ thay đổi?
Kể từ Chrome 50, theo mặc định, các độ trong DeviceOrientationEvent không còn tuyệt đối so với khung toạ độ của Trái Đất. Điều này có nghĩa là DeviceOrientationEvent chỉ được kích hoạt khi có chuyển động thực tế, được phát hiện bằng một số tổ hợp của gia tốc kế và con quay hồi chuyển của thiết bị. Máy đo từ trường và các kết quả đọc sai do sự biến động của trường từ bị loại bỏ.
Nhưng tôi vẫn cần các độ tuyệt đối!
Nếu đang viết JavaScript cần sử dụng độ tuyệt đối, có thể là một phần của ứng dụng web thực tế tăng cường cần ánh xạ trực tiếp vào thế giới thực, thì bạn không gặp phải vấn đề gì. Hành vi trước đó, phụ thuộc vào con quay hồi chuyển của thiết bị, có sẵn thông qua một sự kiện deviceorientationabsolute mới.
Từ góc độ nhà phát triển, thuộc tính này tương tự như DeviceOrientationEvent hiện có, với đảm bảo rằng thuộc tính absolute sẽ được đặt thành true.
Phát hiện những tính năng được hỗ trợ
Những nhà phát triển muốn sử dụng độ tuyệt đối có thể sử dụng tính năng phát hiện tính năng để xác định xem họ có đang sử dụng trình duyệt hỗ trợ sự kiện DeviceOrientationAbsoluteEvent mới hay không:
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.
}
Khả năng tương thích trên nhiều trình duyệt
Các giá trị được báo cáo trong DeviceOrientationEvent chưa bao giờ nhất quán.
Safari và Firefox trên iOS sử dụng các giá trị tương đối cho các độ, khớp với thay đổi về cách triển khai được giới thiệu trong Chrome 50. Thay đổi này sẽ giúp các ứng dụng web được viết cho iOS nhất quán hơn.
Firefox (trên các nền tảng không phải iOS), Edge và Chrome phiên bản trước 50 sử dụng các giá trị độ tuyệt đối choDeviceOrientationEvent khi chạy trên các thiết bị có cảm biến thích hợp.
Tại thời điểm viết bài này, Chrome 50 là trình duyệt đầu tiên hỗ trợ DeviceOrientationAbsoluteEvent mới.
Theo dõi hướng nâng cao bằng DeviceMotionEvent
Boris Smus có một bài viết chi tiết tuyệt vời nêu chi tiết một số nhược điểm của việc sử dụng DeviceOrientationEvent và cách triển khai tính năng hợp nhất cảm biến tuỳ chỉnh bằng DeviceMotionEvent.
Các API này cung cấp quyền truy cập cấp thấp vào gia tốc kế và con quay hồi chuyển, đồng thời có thể mang đến trải nghiệm thực tế ảo chính xác hơn cho người dùng.