HTML5如何计算手机摇动次数

这篇文章主要介绍HTML5如何计算手机摇动次数，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

H5计算手机摇动次数

1、 deviceOrientation：封装了方向传感器数据的事件，可以获取手机静止状态下的方向数据，例如手机所处角度、方位、朝向等。

2、 deviceMotion：封装了运动传感器数据的事件，可以获取手机运动状态下的运动加速度等数据。

不多说直接上代码:

JavaScript：

varjsonObject=null;
//当页面加载完以后会执行window.onload
window.onload=function(){
vartimes=-1;//记录摇动次数
varlast_time=0;
varborderSpeed=800;//加速度变化临界值
varx=y=z=last_x=last_y=last_z=0;
if(window.DeviceMotionEvent){
window.addEventListener('devicemotion',shake,false);
}
else
{
alert('您的设备不支持摇一摇哦');
}
//每次手机移动的时候都会执行下面shake函数的代码
functionshake(eventData)
{
varacceleration=eventData.accelerationIncludingGravity;
varcurTime=newDate().getTime();
vardiffTime=curTime-last_time;
//每隔100ms进行判断
if(diffTime>100){
x=acceleration.x;
y=acceleration.y;
z=acceleration.z;
varspeed=Math.abs(x+y+z-last_x-last_y-last_z)/diffTime*10000;
//判断手机确实发生了摇动而不是正常的移动
if(speed>borderSpeed){
times++;
document.getElementById("text").innerHTML=times+"times";
//用户的微信昵称和头像连接发送一次即可，不需要每次都发送
if(times==0)
{
document.forms["insertForm"].headimg.value=img;
document.forms["insertForm"].user.value=nickname;
}
document.forms["insertForm"].time.value=times;
}
last_time=curTime;
last_x=x;
last_y=y;
last_z=z;
}
}
}

html：

<imgsrc="hand.png">
<br/><fontsize="16"color="red"id="text"></font>

以上是“HTML5如何计算手机摇动次数”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注恰卡编程网行业资讯频道！