html5陀螺仪
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> /** 1.deviceorientation 设备的物理方向信息,表示为一系列本地坐标的旋角 2.devicemotion 设备加速信息 3.compassneedscalibration 通知web站点使用罗盘信息校准上述事件 */ //获取旋转角度 window.addEventListener("deviceorientation",function(event){ /** alpha 以z为轴取值在(0,360) beta 以x为轴取值为(-180,180) gamma 以y为轴取值为(-90,90) */ console.log(event.alpha,event.beta,event.gamma) },true); //获取罗盘校准 window.addEventListener("compassneedscalibration",function(event){ alert("请校准你的罗盘!"); event.preventDefault(); },true) //获取重力加速度 window.addEventListener("devicemotion",function(event){ //处理event.acceleration //x y z 方向移动加速度值 //event.accelerationIncludingGravity //考虑重力加速度后设备在x y z 的值 //event.rotationRate //alpha beta gamma 设备绕x y z 旋转的角度 //摇一摇示例 /** var speed = 30; var x = y =z = lastX = lastY = lastZ = 0; function deviceMotionHandler(eventData){ var acceleration = eventData.accelerationIncludingGravity; x = acceleration.x; y = acceleration.y; z = acceleration.z; if(Math.abs(x-lastX) > speed || Masth.abs(y-lastY) > speed ||Masth.abs(z-lastZ) > speed ){ //触发摇一摇 alert(1); } } */ },true); </script> </body> </html>