我正在使用JavaScript中的deviceorientation,我注意到我的Ipad(iOS 6.1)和我的Nexus7(Android 4.2.2)之间存在一些差异。
此代码不会与Ipad和Nexus7打印相同的数据。
<html>
<head/>
<body>
<button id="calibrate">Calibrate</button>
<button id="stop">Stop</button>
<button id="play">Play</button>
<div id="log"><p></p></div>
<script>
var log = document.getElementById('log');
var calibrate = false;
var calibrateG = 0, calibrateB = 0, calibrateA = 0;
var deviceorientation = function(e) {
if (calibrate) {
calibrateG = e.gamma;
calibrateB = e.beta;
calibrateA = e.alpha;
calibrate = false;
}
var gamma = parseInt(e.gamma - calibrateG);
var beta = parseInt(e.beta - calibrateB);
var alpha = parseInt(e.alpha - calibrateA);
var p = document.createElement('p');
p.innerHTML = gamma + ' ' + beta + ' ' + alpha;
log.insertBefore(p, log.firstChild);
}
document.getElementById('stop').onclick = function() {
window.removeEventListener('deviceorientation', deviceorientation);
};
document.getElementById('play').onclick = function() {
window.addEventListener('deviceorientation', deviceorientation);
};
document.getElementById('calibrate').onclick = function() {
calibrate = true;
};
window.addEventListener('deviceorientation', deviceorientation);
</script>
</body>
</html>
启动Android时打印0 0 270和iOS 0 0 0。
然后当我以相同的方式移动它们时,它们不会打印相同的值。
有人可以解释原因,以及是否有办法规范化数据。
更新#1
我已经尝试了一些校准,我关心风景/肖像。 要重现,您可以使用上面的代码,将ipad和nexus7放在您的面前。 校准两者的值(第一个按钮)。 然后取出平板电脑的右上角并旋转它,直到平板电脑达到90度。 平板电脑应位于左侧。
在Android上,gamma从0变为-80然后跳转到270。 在IOS上,伽玛从0到-180没有任何跳跃。
答案 0 :(得分:4)
Full Tilt JS规范化Android和iOS设备定位实现之间的数据值。它还确保每当用户旋转屏幕时,设备定向数据保持一致。
This article提供了Full Tilt JS库中使用的一些技术的摘要。
免责声明:我是上述文章和图书馆的作者。请试一试并直接在Github项目上报告任何问题。
答案 1 :(得分:1)
如果您需要全部三个用于应用程序或游戏,您可以提示用户“直接保持设备”并记录初始值,然后获得这些值的偏移(增量)。您甚至可以将初始校准保存到localStorage,这样就不需要重复了。
如果您只需要横向或纵向,只需将window.innerWidth与window.innerHeight进行比较,或者将其简单地比较为琐碎。