在新的API标准中,可以通过navigator.geolocation来获取设备的当前位置,返回一个位置对象,用户可以从这个对象中得到一些经纬度的相关信息。

navigator.geolocation的三个方法:

1. getCurrentPosition()

2. watchPosition()

3. clearWatch()

getCurrentPosition()

使用方法:navigator.geolocation.getCurrentPosition(successCallback, [errorCallback] , [positionOptions]);

A) successCallback 获取定位成功时执行的回调函数 eg: function(position){alert("纬度:"+position.coords.latitude+";经度:"+position.coords.longitude)};

successCallback返回一个地理数据对象position作为参数,该对象有属性timestamp和coords。timestamp表示该地理数据创建时间(时间戳);coords包括另外七个属性:

  1. coords.latitude:估计纬度
  2. coords.longitude:估计经度
  3. coords.altitude:估计高度
  4. coords.accuracy:所提供的以米为单位的经度和纬度估计的精确度
  5. coords.altitudeAccuracy:所提供的以米为单位的高度估计的精确度
  6. coords.heading: 宿主设备当前移动的角度方向,相对于正北方向顺时针计算
  7. coords.speed:以米每秒为单位的设备的当前对地速度

PS:firefox下还有address属性,可以获取详细地址,不过我得到的地址是错误的,使用方法:position.address.city,具体如下:

QueryInterface:function QueryInterface() { [native code] }
streetNumber:200号
street:人民大道
premises:null
city:上海市
county:null
region:上海市
country:中国
countryCode:CN
postalCode:null
getInterfaces:function getInterfaces() { [native code] }
getHelperForLanguage:function getHelperForLanguage() { [native code] }
contractID:null
classDescription:null
classID:null
implementationLanguage:2
flags:8
SINGLETON:1
THREADSAFE:2
MAIN_THREAD_ONLY:4
DOM_OBJECT:8
PLUGIN_OBJECT:16
CONTENT_NODE:64
RESERVED:2147483648

B) errorCallback 定位失败时执行的回调函数 eg: function(error){alert(error.message);}

errorCallback返回一个错误数据对象error作为参数,该对象有属性:

  1.code :表示失败原因,返回1 or 2 or 3 ,具体为

    PERMISSION_DENIED (数值为1) 表示没有权限使用地理定位API

    POSITION_UNAVAILABLE (数值为2) 表示无法确定设备的位置,例如一个或多个的用于定位采集程序报告了一个内部错误导致了全部过程的失败

    TIMEOUT (数值为3) 表示超时

    详情查看 http://dev.w3.org/geo/api/spec-source.html#permission_denied_error

  2.message :错误提示内容

C) positionOptions 用来设置positionOptions来更精细的执行定位,positionOptions拥有三个属性{enableHighAccuracy:boolean , timeout:long , maximumAge:long}。

enableHighAccuracy 【true or false(默认)】是否返回更详细更准确的结构,默认为false不启用,选择true则启用,但是会导致较长的响应时间及增加功耗,这种情况更多的用在移动设备上。

timeout 设备位置获取操作的超时时间设定(不包括获取用户权限时间),单位为毫秒,如果在设定的timeout时间内未能获取位置定位,则会执行errorCallback()返回code(3)。如果未设定timeout,那么timeout默认为无穷大,如果timeout为负数,则默认timeout为0。

maximumAge 设定位置缓存时间,以毫秒为单位,如果不设置该值,该值默认为0,如果设定负数,则默认为0。该值为0时,位置定位时会重新获取一个新的位置对象;该值大于0时,即从上一次获取位置时开始,缓存位置对象,如果再次获取位置时间不超过maximumAge,则返回缓存中的位置,如果超出maximumAge,则重新获取一个新的位置。

watchPosition()

功能getCurrentPosition()相似,watchPosition()是定期轮询设备的位置,同样拥有3个参数,与getCurrentPosition()相同。

使用方法:navigator.geolocation.watchPosition(successCallback, [errorCallback] , [positionOptions]);

执行步骤:

1.首先初始化positionOptions内的属性(详细同上)。

2.判断是否有缓存位置对象,该对象年龄是否可用、是否超出maximumAge ,如果可用且未超出,返回缓存位置,否则重新确定设备位置。

3.位置定位操作:

  i.建立一个计时器,进行位置获取操作,如果在timeout之前完成,执行下一步;如果未在timeout之前完成,则执行errorCallback(),code为3,跳出步骤做等待重新激活。

  ii.如果在timeout之前获得位置成功,则执行successCallback(),然后重置计时器(从获取位置成功时刻重新算起),继续挂起获取新位置。当有与之前位置有明显不同位置出现时,再次执行successCallback(),并重复操作,该循环直到timeout超时或者获取操作中遇到POSITION_UNAVAILABLE错误执行errorCallback()为止,亦或者执行clearWatch()操作。

clearWatch()

配合watchPosition()使用,用于停止watchPosition()轮询。

watchPosition()需要定义一个watchID,var watchID = watchPosition(...),通过clearWatch(watchID)来停止watchPosition(),使用方法类似setInterval。

相关资料:

1. http://dev.w3.org/geo/api/spec-source.html#geolocation

2. http://kb.cnblogs.com/page/108732/

JS新API标准 地理定位(navigator.geolocation)的更多相关文章

  1. JS新API标准 地理定位(navigator.geolocation)/////////zzzzzzzzzzz

    在新的API标准中,可以通过navigator.geolocation来获取设备的当前位置,返回一个位置对象,用户可以从这个对象中得到一些经纬度的相关信息. navigator.geolocation ...

  2. HTML5调用百度地图API进行地理定位实例

    自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图AP ...

  3. js定位navigator.geolocation

    一.简介 html5为window.navigator提供了geolocation属性,用于获取基于浏览器的当前用户地理位置. window.navigator.geolocation提供了3个方法分 ...

  4. HTML5 十大新特性(六)——地理定位

    简单地用一句话概括就是,使用js获取浏览器当前所在的地理坐标,实现LBS(Location Based Service,基于定位的服务). 下面写一下它的基本调用: if(navigator.geol ...

  5. 利用GeoIP数据库及API进行地理定位查询 Java

    地理定位查询的的数据库比较多,而且大多都开放一些free的版本 国内的有纯真数据库等,但是他只提供文本的地理位置信息,不提供经纬度数据 当应用到google map时,就不可以了 国外的有MaxMin ...

  6. HTML5浏览器定位navigator.geolocation.getCurrentPosition

    <!DOCTYPE html> <html> <body> <p id="demo">点击这个按钮,获得您的坐标:</p> ...

  7. 利用GeoIP数据库及API进行地理定位查询

    GeoIP数据库下载地址:http://geolite.maxmind.com/download/geoip/database/GeoLiteCountry/GeoIP.dat.gz. 首先,在Max ...

  8. 用HTML5、地理定位API和Web服务来开发移动应用

    HTML 5 是一项让人振奋的技术,这有着充分的理由.这将会是一次技术突破,因为它可以将桌面应用程序功能带入浏览器中.除了传统浏览器外,对于移动浏览器,其潜力甚至更大.不仅如此,最流行的移动浏览器甚至 ...

  9. Geolocation地理定位

    地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...

随机推荐

  1. 无限分页//////////////zz

    由于网页的执行都是单线程的,在JS执行的过程中,页面会呈现阻塞状态.因此,如果JS处理的数据量过大,过程复杂,可能会造成页面的卡顿.传统的数据展现都以分页的形式,但是分页的效果并不好,需要用户手动点击 ...

  2. TextField文本框

    1)失去第一响应者状态方法(即关闭键盘) 要先将视图view的底层类设置为UIControl类 再设置view的touch down事件,在事件中写入以下方法 [self.textField resi ...

  3. 物理引擎-Physx的源代码去哪里找

    前几天无意中看到了Physx开源了,就连自己的领导也高兴了一下,让本道士去下载源代码琢磨一下,顺便做几个例子跑起来.结果没成想这个nvidia的github上的源代码被移除了,而且csdn,pudn上 ...

  4. Node判断文件是否链接

    通过fs.stat(), fs.lstate() and fs.fstate()都可以得到fs.Stats对象, 其中stats.isSymbolicLink()方法用来判断是否链接, 然而一直都不成 ...

  5. rabbimq连接问题处理

    今天遇到一个rabbitmq的连接问题,之前自己写代码测试的时候并没有出现过,所以做个小总结,由于是其他项目测试部署环境发现的问题,所以一开始排查还是有点坑... 客户端上新建一个rabbitmq的c ...

  6. Rational Rose

    Rational Rose简明实用教程 http://furzoom.com/rational-rose-course/ Unidirectional Association 单向关联 general ...

  7. SCALA XML pattern attrbute(属性)

    from: Working with Scala's XML Support 虽然这个guy炒鸡罗嗦,但是还是讲到我要的那句话:  Because Scala doesn't support XML ...

  8. iOS开发中设置UITextField的占位文字的颜色,和光标的颜色

    在iOS开发中,对于很多初学者而言,很有可能碰到需要修改UITextField的占位文字的颜色,以及当UITextField成为第一响应者后光标的颜色,那么下面小编就介绍一下修改占位文字和光标的颜色. ...

  9. 我的Android第一章

    一.android是什么 基于linux系统下开发的开源系统 二.android的具体架构是什么 硬件[智能设备底层的硬件],驱动[软件和硬件之间沟通的桥梁],Linux系统[一款功能强大代码开源的系 ...

  10. Angular--页面间切换及传值的四种方法

    1. 基于ui-router的页面跳转传参(1) 在AngularJS的app.js中用ui-router定义路由,比如现在有两个页面,一个页面(producers.html)放置了多个produce ...