phonegap 的指南针 api Compass

一、 Compass 介绍方法参数  

   1、Compass 也就是,常说的指南针,又叫罗盘

   2、方法

    compass.getCurrentHeading

    compass.watchHeading

    compass.clearWatch

    compass.watchHeadingFilter (obsolete)         1.6版本以上不支持

    compass.clearWatchFilter (obsolete)    1.6版本以上不支持

  3、参数

    compassSuccess compassError

    compassOptions compassHeading

二、 compass.getCurrentHeading 对象              主要获取罗盘的当前朝向。

   1、navigator.compass.getCurrentHeading(compassSuccess, compassError, compassOptions);

    compassSuccess 成功的回调函数

    compassError 失败的回调函数

    compassOptions 获取指南针信息时的一个选项例如:频率,它一般为一个 json 对象在 (compass.watchHeading)中用

  2、回调成功后会用到 compassHeading 对象

    magneticHeading:罗盘在某一时刻的朝向,取值范围是 0 - 359.99 度。(数字类型)

    trueHeading:罗盘在某一时刻相对于北极的朝向,取值范围是 0 - 359.99 度。如果是负 值则表明该参数不确定。(数字类型)

    headingAccuracy:实际度数(magneticHeading)和记录度数(trueHeading)之间的偏差。(数字类型)

    timestamp:确定罗盘朝向的时刻.。(毫秒数)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>phonegap_device_network_notification01</title>
<link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/>
<script src="../jquery.js" type="text/javascript"></script>
<script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script>
<script src="../cordova.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">

    // 等待Cordova加载
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova加载完成
    function onDeviceReady() {
        $(‘#getCurrentHeading‘).click(function(){
            navigator.compass.getCurrentHeading(onSuccess, onError);
        })            

    }
    function onSuccess(heading){
        alert(‘Heading: ‘ + heading.magneticHeading);
    }
    function onError(compassError) {
        alert(‘Compass Error: ‘ + compassError.code);
    }
 </script>

</head>
<body>
<div data-role="page">
        <div data-role="header">
            <h1>PhoneGap100实战</h1>
        </div>
        <div data-role="content">
             <h1>指南针例子</h1>
             <a href="#" data-role=‘button‘ id="getCurrentHeading">点击获取当前的朝向</a>
                <p>getCurrentHeading</p>
        </div>
        <div data-role="footer">
            <h4>&nbsp;</h4>
        </div>
</div>

</body>
</html>

  

时间: 2024-10-13 17:53:52

phonegap 的指南针 api Compass的相关文章

小白学phoneGap《构建跨平台APP:phoneGap移动应用实战》连载一(PhoneGap中的API)

之前本博连载过<构建跨平台APP:jQuery Mobile移动应用实战>一书.深受移动开发入门人员的喜爱. 从如今開始,连载它的孪生姐妹书phoneGap移动应用实战一书,希望以前是小白的你们,已经变成了大白. 3.6  PhoneGap中的API能干什么 本章主要介绍进行PhoneGap开发前所须要做好的准备,那么如今是不是该介绍一些关于PhoneGap的事了呢?事实上PhoneGap就是将HTML写成的页面显示出来.然后通过特定的JavaScript获取几组数据而已. 尽管说使用Phon

phonegap的照相机 API

一. Camera Api 简单介绍 Camera 选择使用摄像头拍照,或从设备相册中获取一张照片.图片以 base64 编码的 字符串或图片 URI 形式返回. 方法: 1. camera.getPicture 拍照获取相册图片 navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] ); cameraSuccess:提供图像数据的 onSuccess 回调函数. cameraError:提供错误信息

PhoneGap 的文件 api

一. 文件系统的请求 请求文件系统通过 window.requestFileSystem 来完函数声明如下: window.requestFileSystem(type, size, successCallback, errorCallback) type: 文件系统类型 可选参数俩个 LocalFileSystem.PERSISTENT:用于不经过应用程序或者用户许可就无法通过用户代理移除的存储类型. LocalFileSystem.TEMPORARY:用于不需要保证持久化的存储类型. siz

面向Web Cloud的HTML5 App开发实战:Browser&amp;HTML5&amp;CSS3&amp;PhoneGap&amp;jQuery Mobile&amp; WebSocket&amp;Node.js(3天)

课程简介: 王家林老师(联系邮箱[email protected] 电话:18610086859 QQ:1740415547 微信号:18610086859) 22个HTML5主题一次性贯穿HTML5的一切技术: 一网打尽HTML5时代Device.(设备端).Browser(浏览器)和Cloud(浏览器)的所有技术: 以浏览器定制技术为基础,通晓HTML5+CSS3+PhoneGap+Web Socket +jQuery Mobile +Node.js等HTML5的六大核心技术: 最新研发的H

Phonegap中自定义插件的使用

在phonegap中需要实现特定相关的功能,可能需要自定义扩展一下功能,那么扩展phonegap组件就成为了可能. 源代码结构图: 本文目的在于讲述怎么扩展一个phonegap组件以及实现. 针对phonegap中activty扩展类: Java代码   package com.easyway.phonegap.datepicker; import com.phonegap.*; import android.os.Bundle; /** * 实现DroidGap的 * * @Title: * 

29、phonegap入门

0. PhoneGap介绍 0.1  什么是PhoneGap? PhoneGap是一个基于HTML.CSS.JS创建跨平台移动应程序的快速开发平台.与传统Web应用不同的是,它使开发者能够利用iPhone.Android等职能手机的核心本地功能,比如GPS.传感器.震动. 0. PhoneGap介绍 0.1  什么是PhoneGap? PhoneGap是一个基于HTML.CSS.JS创建跨平台移动应程序的快速开发平台.与传统Web应用不同的是,它使开发者能够利用iPhone.Android等职能

使用Intellij Idea 搭建PhoneGap Android开发环境

看这里:使用Intellij Idea 搭建PhoneGap Android开发环境 最近几天在学习使用phonegap进行android应用的开发,首先当然是phonegap android开发环境的搭建,网上的资料比较乱,cordova和phonegap也有点分不清,个人参考了很多资料,也试验了很多次,一直在摸索,总算小有心得,这里简单的整理一下,使用Intellij Idea 搭建PhoneGap Android开发环境. 首先需要理清楚phonegap和cordova的关系,以下内容引自

[PhoneGap]开发环境搭建与简单应用

目前,随着Google的Android手机和苹果的iphone手机的逐渐普及,越来越多开发者加入到移动应用开发的大军当中.其中,Android应用是基于Java语言基础上进行开发的,而苹果公司的iphone则是基于C语言开发的.如果开发者编写的应用需要同时在不同的移动设备上运行的话,则必须要掌握多种开发语言.而为了进一步简化移动应用的编程,Nitobi公司推出了一套开源的移动应用解决方案PhoneGap(http://www.phonegap.com). PhoneGap是一款开源的手机应用开发

Phonegap 通信原理

下图为JavaScript调用本地代码的通信过程 Phonegap的核心API都是基于插件的,这些JavaScript API都会调用cordova.exec() 函数来完成操作.cordova.exec()函数如下 cordova.exec(success, fail, service, action, args); 其中success是操作成功后的回调函数 fail是操作失败后的回调函数 service是所要操作的本地服务名称 action是要执行的服务的具体操作 args是操作所需要的参数