如何从Javascript访问加速度计/陀螺仪数据？ [英] How to access accelerometer/gyroscope data from Javascript?

问题描述

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

I have recently come across a few websites that seems to access the accelerometer or gyroscope on my laptop, detecting changes in orientation or movement.

这是怎么做到的？我必须在窗口对象上订阅某种活动吗？

How is this done? Must I subscribe to some kind of event on the window object?

在哪些设备（笔记本电脑，手机，平板电脑）这有用吗？

On which devices (laptops, mobile phones, tablets) is this known to work?

^{NB ：我其实已经知道了（部分）这个问题的答案，我将立即发布。我在这里发布问题的原因是让其他人知道加速计数据 在Javascript（在某些设备上）可用，并挑战社区发布关于该主题的新发现。目前，似乎几乎没有这些功能的文档。}

^{NB: I actually already know (part of) the answer to this question, and I am going to post it right away. The reason that I am posting the question here, is to let everyone else know that accelerometer data is available in Javascript (on certain devices) and to challenge the community to post new findings on the subject. Currently, there seems to be almost no documentation of these features.}

推荐答案

目前有三个不同的事件可能或者在客户端设备移动时可能不会触发。其中两个围绕方向，最后一个围绕动作：

There are currently three distinct events which may or may not be triggered when the client devices moves. Two of them are focused around orientation and the last on motion:

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

• ondeviceorientation is known to work on the desktop version of Chrome, and most Apple laptops seems to have the hardware required for this to work. It also works on Mobile Safari on the iPhone 4 with iOS 4.2. In the event handler function, you can access alpha, beta, gamma values on the event data supplied as the only argument to the function.

onmozorientation 。同样，这在大多数Apple笔记本电脑上都可以使用，但也可以在带有加速度计的Windows或Linux机器上运行。在事件处理函数中，查找 x ， y ， z 作为第一个参数提供的事件数据上的字段。

onmozorientation is supported on Firefox 3.6 and newer. Again, this is known to work on most Apple laptops, but might work on Windows or Linux machines with accelerometer as well. In the event handler function, look for x, y, z fields on the event data supplied as first argument.

ondevicemotion 已知适用于iPhone 3GS + 4和iPad（均带有iOS 4.2），并提供与客户端设备当前加速相关的数据。传递给处理函数的事件数据有 acceleration 和 accelerationIncludingGravity ，每个轴都有三个字段： x ， y ， z

ondevicemotion is known to work on iPhone 3GS + 4 and iPad (both with iOS 4.2), and provides data related to the current acceleration of the client device. The event data passed to the handler function has acceleration and accelerationIncludingGravity, which both have three fields for each axis: x, y, z

地震检测样本网站使用一系列 if 语句来确定哪个事件附加（以某种优先顺序排列）并将收到的数据传递给共同的倾斜函数：

The "earthquake detecting" sample website uses a series of if statements to figure out which event to attach to (in a somewhat prioritized order) and passes the data received to a common tilt function:

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用于对齐来自的读数后两个事件与第一个事件有关，但这些绝不是精确的表示。对于这个简单的玩具项目，它工作得很好，但是如果你需要将数据用于稍微更严重的事情，你必须熟悉不同事件中提供的值的单位并尊重他们:)

The constant factors 2 and 50 are used to "align" the readings from the two latter events with those from the first, but these are by no means precise representations. For this simple "toy" project it works just fine, but if you need to use the data for something slightly more serious, you will have to get familiar with the units of the values provided in the different events and treat them with respect :)

这篇关于如何从Javascript访问加速度计/陀螺仪数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！