如何在Web浏览器中检测设备是否具有陀螺仪?

Par*_*rth 12 javascript 3d mobile accelerometer gyroscope

我正在使用THREE.js并创建一个Web应用程序,用户可以旋转设备,场景将相应移动.同样的事情也来.

我在区分具有陀螺仪的设备和不具有陀螺仪的设备方面存在问题.

检测完全没有方向传感器的设备很容易.DeviceOrientationEvent的所有alpha,beta,gamma值均为null.但是,如果移动设备没有陀螺仪,它仍会在DeviceOrientationEvent中提供alpha,beta,gamma值.问题是这些值非常嘈杂,并且在场景中引起很多震动.所以,我想禁用这些设备的设备方向.但是,到目前为止,我还没有找到如何确定数据是来自陀螺仪还是加速度计(这是我对数据来源​​的猜测).

我不知道它是否有帮助,但在这里可以看到如何处理这个问题的一个很好的例子.(按下底部的轴像图标;你必须在没有陀螺仪和陀螺仪的设备上看到它才能看到差异).他们为没有陀螺仪的设备所做的只是更新音高滚动.该偏航当你与手机旋转不会被更新.

所以,这绝对是可能的,但我还没有发现经过大量搜索后的情况.如果有人能帮忙的话会很棒.

非常感谢.

编辑:

在只有加速度计的设备上,如MOTO E,所有值都为null - DeviceOrientationEventrotationRate - 唯一的例外是accelerationIncludingGravity.但是,我之前测试的设备,没有陀螺仪,但仍然为DeviceOrientationEvent提供alpha,beta,gamma值,根据GSM Arena上的"传感器"细节,似乎有2个加速度计.这就是我怀疑它能够提供DeviceOrientationEvent数据的方式,尽管很吵.看起来2个加速度计不足以提供转速;)

小智 15

如果要检查陀螺仪是否存在,请检查只有陀螺仪可以测量的参数.例如,旋转速率仅是陀螺仪测量的东西.

看一下示例代码,说明是否存在陀螺仪:

var gyroPresent = false;
window.addEventListener("devicemotion", function(event){
    if(event.rotationRate.alpha || event.rotationRate.beta || event.rotationRate.gamma)
        gyroPresent = true;
});
Run Code Online (Sandbox Code Playgroud)

希望这可以帮助!

编辑:

只是一个小注释:这里使用了DeviceMotionEvent,因为只能从此事件访问rotationRate(和加速度等).OP只尝试过DeviceOrientationEvent,所以值得一提.