HTML5 设备方向 - 可靠的指南针实施？

Question

我正在开发一个移动网络项目，需要知道用户设备指向的罗盘方向。现在非常简单，但这就是我所拥有的：

        var updateDirection = function (evt) {
            $("#direction").val(evt.alpha);
        };

        window.addEventListener("deviceorientation", updateDirection);

根据我迄今为止的研究，事件的 Alpha 通道应该是指南针位置。然而，我观察到（并读到）有各种各样基于操作系统和浏览器的实现。

• 在我的 HTC 智能手机上，在 Chrome 或默认 Android 浏览器中，当我将手机完全垂直地保持在“自拍”位置时，我只能获得合理的读数（0 度 = 北，90 = 东，依此类推）。手机的任何角度都会使读数偏离很远。
• 在使用 Chrome 的 Surface Pro 上，我无法获得大于 50 左右的读数。
• 在使用 Edge 的 Surface Pro 上，我得到了非常合理的读数，但只有当我水平握住设备时，就像它放在桌子上一样。

人们似乎已经实现了在移动浏览器中获取指南针方向，而不管设备如何。我可以使用一些库来执行此操作吗？或者是否有必要简单地针对许多不同的特定场景进行编码，例如本示例，该示例也不适用于列出的所有设备：

设备方向事件

Answer 1

你真的有必要使用 javascript 来确定方向吗？

您可以使用CSS 媒体查询获得相同的结果