HTML5 地理位置定位(HTML5 Geolocation)原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用。今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个浏览器的数据精度情况。
在访问位置信息前,浏览器都会询问用户是否共享其位置信息,以 Chrome 浏览器为例,如果您允许 Chrome 浏览器与网站共享您的位置,Chrome 浏览器会向 Google 位置服务发送本地网络信息,估计您所在的位置。然后,浏览器会与请求使用您位置的网站共享您的位置。
HTML5 Geolocation API 使用非常简单,基本调用方式如下:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(locationSuccess, locationError,{
// 指示浏览器获取高精度的位置,默认为false
enableHighAccuracy: true,
// 指定获取地理位置的超时时间,默认不限时,单位为毫秒
timeout: 5000,
// 最长有效期,在重复获取地理位置时,此参数指定多久再次获取位置。
maximumAge: 3000
});
}else{
alert("Your browser does not support Geolocation!");
}
locationError为获取位置信息失败的回调函数,可以根据错误类型提示信息:
locationError: function(error){
switch(error.code) {
case error.TIMEOUT:
showError("A timeout occured! Please try again!");
break;
case error.POSITION_UNAVAILABLE:
showError('We can\'t detect your location. Sorry!');
break;
case error.PERMISSION_DENIED:
showError('Please allow geolocation access for this to work.');
break;
case error.UNKNOWN_ERROR:
showError('An unknown error occured!');
break;
}
}
HTML5 地理位置定位(HTML5 Geolocation)原理及应用的更多相关文章
- [Javascript] HTML5 地理位置定位(HTML5 Geolocation)原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- HTML5 地理位置定位API(3)
HTML5 地理位置定位实例 这篇文章主要为大家介绍了HTML5地理定位的方法,实例讲述了html5获取坐标完整实现过程, 并对比不同浏览器运行效果给出参考结果,需要的朋友可以参考下 本文实例讲述了h ...
- HTML5 地理位置定位API(1)
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- 使用HTML5地理位置定位到城市的方法及注意事项
介绍 本文将简述一下如何通过HTML5和百度地图开放平台提供的API来实现对浏览器的定位.实现效果为显示出用户所在的省市,即: XXX省 XXX市. 实现思路 利用HTML5 提供的API获取到用户的 ...
- html5地理位置定位功能小析
Geolocationd 基本原理1.GPS GPS基本原理是测量出已知位置的卫星到用户接收机之间的距离,然后综合多颗卫星的数据就可知道接收机的具体位置.适用于具备GPS功能的设备(1)优点:在 ...
- HTML5 地理位置定位API(5)
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API(2)
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API(4)
地理定位(geolocation)是最令人兴奋,而且得到了广泛支持的一个新API.通过这套API, JavaScript代码能够访问到用户的 当前位置信息.当然,访问之前必须得到用户的明确许可,即同意 ...
- HTML5浏览器定位navigator.geolocation.getCurrentPosition
<!DOCTYPE html> <html> <body> <p id="demo">点击这个按钮,获得您的坐标:</p> ...
随机推荐
- wordpress 打开卡在1.gravatar.com
grevatar.com打不开,涉及到加载头像的地方都会变慢. 可以使用https的头像链接代替http链接 官方Gravatar头像调用ssl头像链接 进入wordpress后台->外观-&g ...
- 两台装有Ubuntu系统的服务器搭建VPN(一台为本地服务器,另一台为云服务器)
我们搭建VPN采用的是openvpn,搭建过程总体需要经过三大步骤: 1.openvpn的安装与配置 2.端口转发 3.系统重启iptables规则自动生效 注意:以下所有名令在ro ...
- 多线程的学习与python实现
学习了进程与线程,现对自己的学习进行记录. 目录: 一.进程与线程的概念,以及联系与区别 二.多线程 三.python中多线程的应用 四.python实例 五.参考文献 一.进程与线程的概念.以及联系 ...
- 高斯过程(gaussian process)
Definition 1. A Gaussian Process is a collection of random variables, any finite number of which hav ...
- rpc使用JUnit模块测试设计的方法及常见问题
RPC:Remote Procedure Call 远程过程调用 Wikipedia:http://en.wikipedia.org/wiki/Remote_Procedure_Call 百度百科:h ...
- 如何判断js中的数据类型?
js六大数据类型:number.string.object.Boolean.null.undefined string: 由单引号或双引号来说明,如"string" number: ...
- linux安装jdk(以centos安装jdk1.7为例)
1准备工作: 1 虚拟机一台vmware12,安装64位centos 2 oracle官网下载jdk1.7-linux-x64.rpm 3 winscp将jdk传送到linux上面 2开始安装: 1 ...
- JavaScript测试题
您的回答: 1.我们可以在下列哪个 HTML 元素中放置 Javascript 代码? 您的回答:<script> 2.写 "Hello World" 的正确 Java ...
- PCB Layout高速电路设计小知识点
1.单位:1mil = 0.0254mm 2.default线宽及线距(综合考虑高速电路性能及PCB板厂制程能力):6mil 3.差分走线特征阻抗:100ohm 4.3W原则,即线间距采用3倍线宽,多 ...
- php实现函数重载
java..net等强类型预言中都有方法重载,但是PHP是弱类型语言,不能确定参数的类型, 而且如果php定义的方法接收一个参数,调用的时候传入多个也不会有问题,所以不能进行重载. 但是我们可以通过p ...