HTML5 获取地理位置信息

Geolocation API的基本知识

在HTML5中,为window.navigator对象新增了一个geolocation属性,可以使用Geolocation API来对该属性进行访问。window.navigator对象的geolocation属性存在三个方法。
取得当前地理位置
可以使用getCurrentPosition()方法来取得用户当前的地理位置信息,该方法的定义如下:
Js代码  收藏代码
void getCurrentPosition(onSuccess, onError, options);
其中第一个参数为获取当前地理位置信息成功时所执行的回调函数,第二个参数为获取当前地理位置信息失败时所执行的回调函数,第三个参数为一些可选属性的列表。其中,后两个参数是可选的。
该方法成功取得地理位置信息时执行的回调函数使用方法如下:
Js代码  收藏代码
navigator.geolocation.getCurrentPosition(function(position) {
    // 获取成功时的处理。
});
如果获取地理位置信息失败,可以通过该方法的第二个参数定义的回调函数把错误信息提示给用户。当在浏览器中打开使用了Geolocation API来获得用户当前位置信息的页面时,浏览器会询问用户是否共享位置信息,如果拒绝共享的话也会引起错误。该回调函数使用一个error对象作为参数,该对象具有两个属性:code属性、message属性。
code属性的可能值有:用户拒绝了位置服务(属性值“1”)、获取不到位置信息(属性值“2”)、获取信息超时(属性值“3”)。
message属性为一个字符串,在该字符串中包含了错误信息,这个错误信息在开发和调试时很有用。有些浏览器不支持该属性。
错误处理回调函数的使用方法如下:
Js代码  收藏代码
navigator.geolocation.getCurrentPosition(function(position) {}, function(error) {
    var errorType = [‘位置服务被拒绝‘, ‘获取不到位置信息‘, ‘获取信息超时‘];
    alert(errorType[error.code - 1]);
});
该方法第三个参数为可选属性列表,这些可选属性包括:
enableHighAccuracy:是否要求高精度的地理位置信息,这个参数在很多设备上设置了都没用,因为使用在设置上时需要结合设备电量、具体地理情况来综合考虑。因此,多数情况下把该属性高为默认,由设备自身来调整。
timeout:对地理位置信息的获取操作做一个超时限制(单位为毫秒)。如果在该时间内未获取到地理位置信息,则返回错误。
maximumAge:对地理位置信息进行缓存的有效时间(单位为毫秒)。超过这个时间后缓存的地理位置信息被废弃,尝试重新获取地理位置信息。如果该值设置为“0”,则无条件重新获取新的地理位置信息。
该属性使用方法如下所示:
Js代码  收藏代码
navigator.geolocation.getCurrentPosition(function(position) {}, function(error) {},
// 以下为可选属性。
{
    maximumAge: 60 * 1000 * 2,  // 设置缓存有效时间为2分钟。
    timeout: 5000
});
持续监视当前地理位置信息
使用watchPosition()方法来持续获取用户的当前地理位置信息,它会定期地自动获取,该方法定义如下:
Js代码  收藏代码
int watchCurrentPosition(onSuccess, onError, options);
该方法三个参数的说明与使用方法与getCurrentPosition()方法相同。该方法返回一个数字,该数字的使用方法与JavaScript脚本中的setInterval()方法的返回结果类似,可以被clearWatch()方法使用,停止对当前地理位置信息的监视。
停止获取当前用户的地理位置信息
使用该方法可以停止对当前用户的地理位置信息的监视。该方法定义如下:
Js代码  收藏代码
void clearWatch(watchId);
该方法的参数为调用watchCurrentPosition()方法监视地理位置信息时的返回参数。
position对象

如果获取地理位置信息成功,则可以在获取成功后的回调函数中通过访问position对象的属性来得到这些地理位置信息。position对象具有如下属性:
latitude:当前地理位置的纬度。
longitude:当前地理位置的经度。
altitude:当前地理位置的海拔高度(不能获取时为null)。
accuracy:获取到的纬度或经度的的精度(以米为单位)。
altitudeAccurancy:获取到的海拔高度的精度(以米为单位)。
heading:设备的前进方向。用面朝正北方向的顺时针旋转角度来表示(不能获取时为null)。
speed:设备的前进速度(以米/秒为单位,不能获取时为null)。
timestamp:获取地理位置信息的时间。

引用来源:   http://lucifinilhades.iteye.com/blog/1226959

时间: 2024-12-17 15:37:36

HTML5 获取地理位置信息的相关文章

html5获取地理位置信息API

在HTML5中,可以看下如何使用Geolocation API来获得用户的地理位置信息,如果该浏览器支持的话,且设备具有定位功能,就能够直接使用这组API来获取当前位置的信息,该API可以应用在移动设备上的地理定位:为window.navigator 对象新增了一个geolocation属性,可以使用Geolocation API来对该属性进行访问.window.navigator对象中的geolocation属性有三个方法如下: 第一个方法是:getCurrentPosition 该方法来取得

HTML5获取地理位置信息

<!DOCTYPE html> <html> <head> <title>Location</title> <meta charset="utf-8"> </head> <body> <input type="button" id="btnLocation" value="获取位置信息"> </body> &

Html5 Geolocation获取地理位置信息(转)

Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. Html5获取地理位置信息是通过Geolocation API提供,使用其getCurrentPosition方法,此方法中有三个参数,分别是成功获取到地理位置信息时所执行的回调函数,失败时所执行的回调函数和可选属性配置项. 如下Demo演示了通过Geolocation获取地理位置信息,并在百度地

通过window.navigator对象获取地理位置信息并在百度地图上显示

通过window.navigator对象获取地理位置信息 Geolocation API:用户可共享地理位置,并在Web应用的协助下享用位置感知服务(location-aware services) window.navigator下的geolocation 对象的 getCurrentPosition 方法可以获取当前位置.getCurrentPosition 方法将发起对位置信息的异步请求并将立即返回.如果该请求成功完成,则调用用来实现位置数据接收的成功回调. 下面演示如何调用 getCur

Android 获取地理位置信息 封装好了 直接用

前言:花了一个早上研究了以下android获取经纬度,然后网上的参考资料都是杂七杂八,基本上都是过去几年的,现在我用 android6.0参照别人的结果发生好多错误,我的内心几乎是崩溃的.后来,不断百度,不断goole,不断查找资料,终于解决了,而且完美打包,以后直接用就可以了. 1.这个类原来是用kotlin写的,后来有些东西和java又不同,索性就改成java吧,反正他们兼容性很强-----封装的类名为:LocationUtil package com.example.jason_jan.g

[iOS]获取地理位置信息

1.在工程的 info.plist 文件中增加两个key( 右键 - Add Row ) Privacy - Location Always and When In Use Usage Description Privacy - Location When In Use Usage Description value里输入征求获取位置信息时展示的提示语: 2.在需要获取地理位置信息的文件中 #import <CoreLocation/CoreLocation.h> 在interfce行添加相关

HTML5获取地理位置定位信息

HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用.本文结合实例给大家分享如何使用HTML5,借助百度.谷歌地图接口来获取用户准确的地理位置信息. 如何使用HTML5地理位置定位功能 定位功能(Geolocation)是HTML5的新特性,因此只有在支持HTML5的现代浏览器上运行,特别是手持设备如iphone,地理定位更加精确.首先我们要检测用户设备浏览器是否支持地理定位,如果支持则获取地理信息.注意这个

HTML5获取地理位置

HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Internet Explorer 9.0+ 手机支持情况: Android 2.0+iPhone 3.0+Opera Mobile 10.1+Symbian (S60 3rd & 5th generation)Blackberry OS 6Maemo 检测浏览器是否支持: if (navigator.geol

获取地理位置信息

在HTML5中,为window.navigator对象新增了一个geolocation属性,可以使用Geolocation API来对该属性进行访问.window.navigator对象的geolocation属性存在以下三个方法. void getCurrentPosition(onSuccess,onError,options); 该方法用来获取用户当前的地理位置信息. navigator.geolocation.getCurrentPosition ( function(position)