SilenceHVK / blog

:books: :octocat: Github static blog post, experience the fun of using Issues.Welcome star( 静态博客文章,体验一下使用 Issues 的乐趣,欢迎 star )个人博客地址:blog.hvkcoder.me/love
https://github.com/SilenceHVK/Articles/issues
MIT License
231 stars 9 forks source link

【HTML5 高级API】1. Geolocation API #33

Open SilenceHVK opened 6 years ago

SilenceHVK commented 6 years ago

  使用 navigator.geolocation 对象来获取位置信息,navigator 对象包含有有关浏览器的信息,geolocation 对象包含一系列相关位置操作的方法。geolocation 兼容 IE9 及以上浏览器。

原理说明

  一般流程为:

  1. 用户从浏览器打开位置感应应用程序
  2. 程序执行,geolocation 对象获取位置信息,此时浏览器要求用户授权同意才能够获取信息。
  3. 浏览器内部通过数据源获取信息
  4. 浏览器将获取的信息发送给受信任的外部定位服务,返回位置信息到 geolocation 应用程序

Geolocation API 不指定设备使用哪种底层技术来定位应用程序的用户。设备可以使用 IP地址、GPS、WI-FI、GSM 或 CDMA。

Geolocation 中方法

getCurrentPosition(successCallback,errorCallback,positionOptions) 获取当前地址信息(请求一次)

属性 描述
coords.latitude 十进制数的维度
coords.longitude 十进制数的经度
coords.accuracy 位置精度
coords.altitude 海拔,海平面以上以米计
coords.altitudeAccuracy 位置的海拔精度
coords.heading 方向,从正北开始以度计
coords.speed 速度,以米/每秒计
timestamp 响应的日期/时间

code 可能值:

  1. 当属性值为 1 时,用户不允许地理定位(拒绝授权),"Permission denied"
  2. 当属性值为 2 时,无法获取当前位置,"Position unavailable"
  3. 当属性值为 3 时,操作超时,"Timeout"

  message 属性值为一个字符串,包含了错误信息。

名称 描述
enableHighAccuracy 启用高精度模式,这个参数通知浏览器启用 HTML5 Geolocation 服务的高精度模式。默认值为 false
timeout 超时限制(单位为毫秒)。如果在该时间内未获取到地理位置信息,则返回错误
maximumAge 表示浏览器重新计算位置的时间间隔。单位为 ms,默认值为零,这意味着浏览器每次请求时都必须立即重新计算位置

watchPosition(successCallback,errorCallback,positionOptions) 监视当前地理位置(请求多次)

   watchPosition 可以定期地获取用户地理位置信息。该方法的使用方式与 getCurrentPosition 方法类似,这里调用该方法会返回一个数字,这个数字与 setInterval 方法的返回值用法类似,可以被 clearWatch 方法使用,以停止对当前地理位置信息的监视。

clearWatch(watchId) 清除监视功能

  如果应用程序不再需要接受 watchPosition 的持续位置更新,则只需调用 clearWatch 函数,watchIdwatchPosition 函数的返回值。