大红门网站建设,网站备案审批号,seo权重优化,做蛋糕的网站先说问题#xff1a;浏览器有一个自带原生的获取手机方向的事件方法 deviceorientation: https://developer.mozilla.org/en-US/docs/Web/API/DeviceOrientationEvent/DeviceOrientationEvent
这个事件里面有个实例absolute 看名字知道意思吧#xff0c;对就是绝对坐标的意…先说问题浏览器有一个自带原生的获取手机方向的事件方法 deviceorientation: https://developer.mozilla.org/en-US/docs/Web/API/DeviceOrientationEvent/DeviceOrientationEvent
这个事件里面有个实例absolute 看名字知道意思吧对就是绝对坐标的意思如果带了absolute就是用地球绝对坐标如果不带absolute那么就用的你自己手机设备的相对坐标来参照返回给你当前的aplhabetagamma数据最开始捣鼓了很久发现不同的手机那个位置怎么都不对直接心态崩了然后无意中发现的居然还有个带absolute的事件联想到他的实例熟悉就试了一下然后就发现了这个大坑。
所以正确的打开方式是使用 deviceorientationabsolute 事件
好了下面上代码
function monitor() {//window.DeviceMotionEvent 需使用https 才能拿到这个对象 或者低版本的android机器可以使用http拿到这个陀螺仪设备if (process.env.IS_DEV || window.DeviceMotionEvent) {//陀螺仪这里使用absolute方法来监听方向 如果不带absolute的事件那么用的是相对于手机自带的坐标系 来返回的参数//如果用来absolute的事件那么返回的是相对于地球坐标系的数据window.addEventListener(deviceorientationabsolute,// eslint-disable-next-line typescript-eslint/no-unused-varsthrottle(function (e) {// console.log(e.alpha, e.beta, e.gamma);// 处理你要处理的事情throttlePosition(e);}, 300),false,);} else {alert(您的手机不支持陀螺仪哦~);}
}
monitor(); 重要的坑说三遍由于不同的手机可能不一样。一定要用带absolute的事件方法一定要用带absolute的事件方法一定要用带absolute的事件方法。