javascript - 如何从 Javascript 访问加速度计/陀螺仪数据？

Question

我最近发现一些网站似乎可以访问我笔记本电脑上的加速度计或陀螺仪，检测方向或运动的变化。

这是怎么做到的？我必须订阅 window 对象上的某种事件吗？

已知这可以在哪些设备(笔记本电脑、手机、平板电脑)上运行？

---

^{注意:其实我已经知道(部分)这个问题的答案了，我马上就贴出来。我在这里发布问题的原因是让其他所有人都知道加速度计数据在 Javascript 中可用(在某些设备上)，并挑战社区发布关于该主题的新发现。目前，似乎几乎没有这些功能的文档。}

Answer 1

当前存在三个不同的事件，当客户端设备移动时可能触发也可能不触发。其中两个关注方向，最后一个关注运动:

• ondeviceorientation 已知可以在桌面版 Chrome 上运行，而且大多数 Apple 笔记本电脑似乎都具备运行此功能所需的硬件。它还适用于装有 iOS 4.2 的 iPhone 4 上的 Mobile Safari。在事件处理函数中，您可以访问作为函数唯一参数提供的事件数据的 alpha、beta、gamma 值。

• onmozorientation Firefox 3.6 及更新版本支持。同样，众所周知，这适用于大多数 Apple 笔记本电脑，但也可能适用于带有加速度计的 Windows 或 Linux 机器。在事件处理函数中，在作为第一个参数提供的事件数据上查找 x、y、z 字段。

  <

• ondevicemotion 已知可在 iPhone 3GS + 4 和 iPad(均装有 iOS 4.2)上运行，并提供与客户端设备当前加速相关的数据。传递给处理函数的事件数据有acceleration和accelerationIncludingGravity，它们每个轴都有三个字段:x，y, z

“地震检测”示例网站使用一系列 if 语句来确定要附加到哪个事件(以某种优先顺序)并将接收到的数据传递给一个通用的 tilt 功能:

if (window.DeviceOrientationEvent) {
    window.addEventListener("deviceorientation", function () {
        tilt([event.beta, event.gamma]);
    }, true);
} else if (window.DeviceMotionEvent) {
    window.addEventListener('devicemotion', function () {
        tilt([event.acceleration.x * 2, event.acceleration.y * 2]);
    }, true);
} else {
    window.addEventListener("MozOrientation", function () {
        tilt([orientation.x * 50, orientation.y * 50]);
    }, true);
}

常数因子 2 和 50 用于将后两个事件的读数与第一个事件的读数“对齐”，但这些决不是精确表示。对于这个简单的“玩具”项目，它工作得很好，但如果您需要将数据用于稍微严肃的事情，您将必须熟悉不同事件中提供的值的单位并尊重它们:)