首页 > h5 页面如何获取手机陀螺仪的参数

h5 页面如何获取手机陀螺仪的参数

做一个手机的h5页面,关于一个小球平衡的东西,手机浏览器如何获取手机底层的陀螺仪参数呢?
有没有想过的demo参考一下,谢谢


有个检测设备方向的 API,可以在事件中获取设备 x、y、z 三个轴旋转角度,也许对你有用。
https://developer.mozilla.org/zh-CN/docs/Web/API/Detecting_device_orientation

补充:

在PC端测试模拟的话,可以用谷歌浏览器的模拟器。

我在控制台输入了以下代码,监听该事件。

window.addEventListener('deviceorientation', function(e){
   console.log('absolute: ' + e.absolute)
   console.log('alpha: ' + e.alpha)
   console.log('beta: ' + e.beta)
   console.log('gamma: ' + e.gamma)
});

切换为模拟器模式,随便选一个移动设备。然后按下图所示点进去,你会发现一个新的天地。

支持地理位置模拟和三轴角度模拟。

更改一些数值,控制台正确输出。

【热门文章】
【热门文章】