phonegap入门--3 Accelerometer 加速器

最新推荐文章于 2022-01-19 12:10:14 发布

孟祥月

最新推荐文章于 2022-01-19 12:10:14 发布

阅读量4.3k

点赞数 3

分类专栏： phonegap

本文链接：https://blog.csdn.net/mengxiangyue/article/details/8790651

版权

phonegap 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

昨天刚刚用phonegap2.5.0 发了一篇博客,今天马上phonegap更新到了2.6.0,看着它官方的changlog我也不知道它说的额什么,应该就是修复了bug,这次代码没有使用phonegap2.6.0,从下篇文章开始用.

今天介绍phonegap的Accelerometer加速器，这个API的主要作用是采集设备在x、y、z方向上的动作。我自己的理解就是返回在x、y、z方向上的加速，我再设备上测试的时候，设备的不同放置方式会xyz会返回不同的值，但是一般静止的时候不会超过10，正常的重力加速度是9.8。如果在某个方向上快速移动其值会超过10。所以我认为基本就是反应加速度。

具体这个能做什么我不是很清楚，我记得有一款应用是提醒司机是否超速，我估计就是根据这个。

Accelerometer有三个方法：

accelerometer.getCurrentAcceleration

获取其在xyz方向的加速度。
accelerometer.watchAcceleration

对比第一个方法，这个可以每隔一段时间获取一次xyz方向的加速度
accelerometer.clearWatch

停止对第二个方法定义的加速器的监视

以上三个方法的使用方式，在代码中会有一定解释.

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <title>Device</title>
    </head>
    <body>
    	<h1>Accelerometer</h1>
    	<h3>accelerometer.getCurrentAcceleration</h3>
        <p id="getCurrentAcceleration">Loading device properties...</p>
        
        <h3>accelerometer.watchAcceleration</h3>
        <p id="watchAcceleration">Loading device properties...</p>
        <br/>
        <button οnclick="stopWatch();">Stop Watching</button>
        <script type="text/javascript" src="js/cordova-2.5.0.js"></script>
        <script type="text/javascript">
        	/*
        	 * deviceready事件 设备初始化phonegap所有的API触发的事件
        	 * 建议将所有的涉及到phonegap API的业务代码放到此事件的回调函数中,以免发生不必要的错误
        	 */
            document.addEventListener("deviceready", onDeviceReady, false);

			function onSuccess(acceleration) {
				var element = document.getElementById('getCurrentAcceleration');
				element.innerHTML = 'Acceleration X: ' + acceleration.x + '<br />' +
					 'Acceleration Y: ' + acceleration.y + '<br />' +
					 'Acceleration Z: ' + acceleration.z + '<br />' +
					 'Timestamp: '      + acceleration.timestamp + '<br />';
		   	};
			function onError() {
			   alert('onError!');
			};
			//accelerometer.watchAcceleration
			// The watch id references the current `watchAcceleration`
			var watchID = null;
			/* 调用加速器的时间间隔 单位毫秒*/
	        var options = { frequency: 1000 };
	        function onSuccess1(acceleration) {
		        var element = document.getElementById('watchAcceleration');
		        element.innerHTML = 'Acceleration X: ' + acceleration.x + '<br />' +
		                            'Acceleration Y: ' + acceleration.y + '<br />' +
		                            'Acceleration Z: ' + acceleration.z + '<br />' +
		                            'Timestamp: '      + acceleration.timestamp + '<br />';
		    }
		    function onError1() {
		        alert('onError!');
		    }

			//停止某个加速器监视 
			function stopWatch() {
		        if (watchID) {
		            navigator.accelerometer.clearWatch(watchID);
		            watchID = null;
		        }
		    }
		    function onDeviceReady() {
		    	/*
		    	 * 相信大家一看success error就明白了这两个方法的作用.成功调用/产生错误
		    	 * 第二个方法多一个参数是每隔多久去调用一次加速器
		    	 */
				navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
		        watchID = navigator.accelerometer.watchAcceleration(onSuccess1, onError1, options);
		    }
        </script>
    </body>
</html>

效果如下:

其中watchAcceleration部分的数据是每隔一秒就会变化一次的,当我们点击Stop Watching按钮的时候,它的数据就不会再变化了.

孟祥月

关注

3
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
phonegap入门--3 Accelerometer 加速器

昨天刚刚用phonegap2.5.0 发了一篇博客,今天马上phonegap更新到了2.6.0,看着它官方的changlog我也不知道它说的额什么,应该就是修复了bug,这次代码没有使用phonegap2.6.0,从下篇文章开始用.今天介绍phonegap的Accelerometer加速器，这个API的主要作用是采集设备在x、y、z方向上的动作。我自己的理解就是返回在x、y、z方向上的加速，我
复制链接

扫一扫