仅在移动端才能查看效果
问题:
1.请确保在https环境下打开
2.ios手机需要用户手动获取权限后才能调用
DeviceOrientationEventname="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
// init vConsole
var vConsole = new VConsole();
console.log("Hello world");
var SHAKE_THRESHOLD = 4000;
var last_update = 0;
var x,
y,
z,
last_x = 0,
last_y = 0,
last_z = 0;
if (window.DeviceMotionEvent) {
window.addEventListener("devicemotion", devicemotion, false);
}
//用户授权
function getPermission() {
if (
typeof DeviceMotionEvent !== "undefined" &&
typeof DeviceMotionEvent.requestPermission === "function"
) {
DeviceMotionEvent.requestPermission()
.then(function (state) {
if ("granted" === state) {
window.addEventListener("devicemotion", devicemotion, false);
} else {
alert("apply permission state: " + state);
}
})
.catch(function (err) {
alert("error: " + err);
});
}
}
function devicemotion(eventData) {
var acceleration = eventData.accelerationIncludingGravity;
var curTime = new Date().getTime();
if (curTime - last_update > 10) {
var diffTime = curTime - last_update;
last_update = curTime;
x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
var speed =
(Math.abs(x + y + z - last_x - last_y - last_z) / diffTime) * 10000;
if (speed > SHAKE_THRESHOLD) {
alert("你中奖啦!"); // Do something
}
last_x = x;
last_y = y;
last_z = z;
document.getElementById("text").innerHTML =
"x:" + last_x + "y:" + last_y + "z:" + last_z;
}
}