欧酷网

您的位置:主页>移动开发>

iOS上陀螺仪失效问题

文章目录

    • 1. 功能

    • 2. 问题

    • 3. 解决方案

1. 功能

在实现如下功能时,通常会用到基于HTML5陀螺仪的DeviceMotionEvent和DeviceOrientationEvent。

  1. 摇一摇
  2. 旋转手机看全景图像

DeviceMotionEvent 主要属性:

属性说明单位
acceleration包含x,y,z方向上的加速度m/s^2
accelerationIncludingGravity含x,y,z方向上的加速度且带地球重力加速度g的影响m/s^2
rotationRate绕三个轴每秒的旋转速度deg/s
if(window.DeviceMotionEvent){
	window.addEventListener('devicemotion', function(event) {
		console.log(event.acceleration.x + ' m/s2');
	});}
 

DeviceOrientationEvent 主要属性:

属性说明取值范围默认值趋势
alpha0~360绕z轴转,屏幕长度方向距y轴的偏移角度360/0 附近顺时针至0,逆时针至360
beta-180 到 0 到180绕x轴转,屏幕垂直方向距z轴的偏移角度0附近顺时针至180,逆时针至-180
gamma-90 到 0 到 90绕y轴转,屏幕宽度方向距x轴的偏移角度0附近顺时针至90,逆时针至-90
if (window.DeviceOrientationEvent) {
    window.addEventListener("deviceorientation", function(event) {
        // alpha: 在Z轴上的角度
        var rotateDegrees = event.alpha;
        // gamma: 从左到右
        var leftToRight = event.gamma;
        // beta: 从前到后的运动
        var frontToBack = event.beta;
        handleOrientationEvent(frontToBack, leftToRight, rotateDegrees);
    }, true);}
 

2. 问题

这两个事件,在安卓系统上不会有问题, 但是在IOS12.4以上版本都失效

3. 解决方案

iOS12.4以上版本,必须要使用https协议才能正常使用。

  • 点赞

  • 收藏

  • 分享

  •    
    • 文章举报

辰煦湲

 
发布了94 篇原创文章 ·    获赞 61 ·    访问量 25万+  

私信

关注

相关文章推荐