HTML5 Geolocation(地理定位)用于定位用户的位置。

定位用户的位置

HTML5 Geolocation API 用于获得用户的地理位置。

鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。

浏览器支持

Internet Explorer 9、Firefox、Chrome、Safari 以及 Opera 支持地理定位。对于拥有 GPS 的设备,比如 iPhone,地理定位更加精确。

使用地理定位

HTML5中,navigator.geolocation作为定位對象,拥有三个方法:

  • getCurrentPosition: sucfunc為执行成功的回调函数,errfunc為執行失败的回调函数,options為getCurrentPosition的参数對象

  e.g.navigator.geolocation.getCurrentPosition(sucfunc, errfunc, options);

  • watchPosition: watchPosition和getCurrentPosition類似,但是只要设备位置发生变化,就会执行

  e.g.var watcherId = navigator.geolocation.watchPosition(sucfunc, errfunc, options);

  • clearWatch: clearwatch用于终止watchPosition方法

  e.g.navigator.geolocation.clearWatch(watcherId);

原理

W3C對Geolocation描述如下:

The Geolocation API defines a high-level interface to location information associated only with the device hosting the implementation, such as latitude and longitude. The API itself is agnostic of the underlying location information sources. Common sources of location information include Global Positioning System (GPS) and location inferred from network signals such as IP address, RFID, WiFi and Bluetooth MAC addresses, and GSM/CDMA cell IDs, as well as user input. No guarantee is given that the API returns the device's actual location.

geolocation的位置信息来源包括GPS、IP地址、RFID、WIFI和蓝牙的MAC地址、以及GSM/CDMS的ID等等。规范中没有规定使用这些设备的先后顺序,在HTML5的实现中,移動設備如果使用GPS,則優先使用GPS定位,如果使用了WIFI,則根據WIFI熱點定位,如果使用網線接入,則使用IP來定位,這個準確點則是最低的。

使用GPS可以直接獲取到位置信息,但是對於WIFI和IP定位,瀏覽器本身并不能直接解析,它只能收集WIFI及IP信息,然後通過這些信息請求位置信息服務接口來提供,主流瀏覽器都是使用Google提供的地理位置查詢服務。以Chrome為例,會請求www.googleapi.com解析位置信息。

參考:

http://www.w3school.com.cn/html5/html_5_geolocation.asp

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

HTML5-地理定位的更多相关文章

  1. 基于浏览器的HTML5地理定位

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

  2. HTML5地理定位(已知经纬度,计算两个坐标点之间的距离)

    事实上,地球上任意两个坐标点在地平线上的距离并不是直线,而是球面的弧线. 下面介绍如何利用正矢公式计算已知经纬度数据的两个坐标点之间的距离.半正矢公式也成为Haversine公式,它最早时航海学中的重 ...

  3. HTML5地理定位,百度地图API,知识点熟悉

    推断浏览器的兼容问题: IE9+支持地理定位,FF Chrome新版支持地理定位  if (navigator.geolocation) {        alert('支持地理定位');   } e ...

  4. 小强的HTML5移动开发之路(18)——HTML5地理定位

    来自:http://blog.csdn.net/dawanganban/article/details/18192091 在前面的<小强的HTML5移动开发之路(2)--HTML5的新特性> ...

  5. HTML5 — 地理定位

    Geolocation:地理定位,获取当前浏览器所在的地理坐标信息(包括经度.纬度.海拔高度.移动速度),实现LBS应用(Location Based Service)——基于定位的服务,如订   餐 ...

  6. 手机端网页使用html5地理定位获取位置失败的解决办法

    网上有很多关于html5 geolocation 获取地理定位的方法,我试了下,只有在IE edge浏览器可以成功获取到,在chrome,firefox,手机端的safari,QQ浏览器,微信浏览器, ...

  7. 第182天:HTML5——地理定位

    HTML5 Geolocation(地理定位) HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支 ...

  8. HTML5地理定位

    1.通过navigator.geolocation来获取设备当前位置,返回一个位置对象,可以获得当前经纬度相关信息: 2.navgatior.geolocation的三个方法: getCurrentP ...

  9. Html5——地理定位及地图

    常用的navigator.geolocation对象有以下三种方法: 获取当前地理位置:navigator.geolocation.getCurrentPosition(success_callbac ...

  10. HTML5地理定位-Geolocation API

    HTML5提供了一组Geolocation API,来自navigator定位对象的子对象,获取用户的地理位置信息Geolocation API使用方法:1.判断是否支持 navigator.geol ...

随机推荐

  1. [微信开发利器]微信内移动前端开发抓包调试工具fiddler使用教程

    [微信开发利器]微信内移动前端开发抓包调试工具fiddler使用教程   在朋友圈看到一款疯转的H5小游戏,想要copy,什么?只能在微信里打开?小样,图样图森破,限制了oauth.微信浏览器内打开, ...

  2. tostring格式化输出

    C 货币 2.5.ToString("C") ¥2.50 D 十进制数 25.ToString("D5") 00025 E 科学型 25000.ToString ...

  3. java编程的78条黄金法则

    创建和销毁对象 1.考虑用静态工厂方法(返回类的实例的静态方法)代替构造器2.遇到多个构造器参数时要考虑用构造器3.用私有构造器或者枚举类型强化Singleton属性4.通过私有构造器强化不可实例化的 ...

  4. 2. XAML

    1. 什么是 XAML XAML 可以说是 XML 的一个特殊子集,使用相同的语法,只是 XML 可以自定义任何的节点和属性,但 XAML 是有所限制的,只能在规定的命名空间下使用. 2. names ...

  5. CentOS学习笔记--JDK安装

    JDK安装 大部分的服务都离不开JAVA环境,CentOS里都是OpenJDK,显然我们还是使用JAVA的JDK好.(注:minimal版没有安装OpenJDK,其它版本需要删除这个.) JDK下载 ...

  6. 在Linux命令行窗口中,怎么向上翻页?

    解决方法:本机环境:vmware linux Redhat9.0版本 使用:Shift + PageUp 和 Shift + PageDown向上和向下翻页

  7. 在PeopleSoft系统中实现打印页面的功能

    我们知道,在PeopleSoft HCM里,一般上了薪酬模块的话,都会客户化工资单页面,去匹配公司之前的工资单的报表的格式.有的时候,这个工资单页面又需要打印出来,以供员工的使用.PeopleSoft ...

  8. Centos 7配置ntp时间同步

    1.NTP时钟同步方式说明     NTP在linux下有两种时钟同步方式,分别为直接同步和平滑同步: 1)直接同步      使用ntpdate命令进行同步,直接进行时间变更.如果服务器上存在一个1 ...

  9. 升级Mac X Mavericks MacMiv 无法启动

    今天把Mac 系统升级到了 Mac X Mavericks ,确实有不少的惊喜.虽然体验不出Mac X Mavericks拥有更强的性能/更好的电池表现,但是新版的Safari浏览器的提供了更方便的主 ...

  10. 【转】Spark 体系结构

    原文地址:http://jerryshao.me/architecture/2013/03/29/spark-overview/ 援引@JerryLead的系统架构图作为Spark整体结构的一个 bi ...