geolocation是H5新增的对象,它用于定位,继承在navigator对象内,以前用navigator只用到userAgent,现在就多了这个geolocation

有2种方法(getCurrentPosition、watchPostion),4个配置属性(enableHighAccuracy,timeout,maximumAge,frequency)

getCurrentPosition:

 //获取定位(一次)
navigator.geolocation.getCurrentPosition(
data=>{
// 信息都包含在data.coords里面
},
err=>{
// err是形如 {code: 3, message: "Timeout expired"} 的对象
},
{
enableHighAccuracy:true, //高精度
timeout: 5000, //超时时间
maximumAge: 10000 //位置缓存时间
}
)

data.coords的属性:

  • coords.latitude 纬度
  • coords.longitude 经度
  • coords.altitude 海拔
  • coords.speed 速度
  • coords.accuracy 经纬度精度
  • coords.altitudeAccuracy 海拔精度
  • coords.heading 方向,从正北开始以度计

watchPostion:

 //获取定位(一次)
navigator.geolocation.watchPosition(
data=>{
// 信息都包含在data.coords里面
},
err=>{
// err是形如 {code: 3, message: "Timeout expired"} 的对象
},
{
enableHighAccuracy:true, //高精度
timeout: 5000, //超时时间
maximumAge: 10000, //位置缓存时间
frequency: 1000 //多久监测一次
}
)

ps:geolocation已经不能在http下使用了,只能在https下才行

H5新特性之geolocation的更多相关文章

  1. H5新特性汇总

    H5新特性: 新增选择器 document.querySelector.document.querySelectorAll 拖拽释放(Drag and drop) API 媒体播放的 video 和 ...

  2. H5新特性---SVG--椭圆--直线--文本--滤镜(高斯滤镜--模糊)--地理定位

    今天的目标 3.1:h5新特性--SVG--椭圆 <ellipse rx="" ry=""  cx="" cy="" ...

  3. H5新特性--WebStorage--WebSocke

    今天的目标 3.2:h5新特性--WebStorage localStorage  在客户端浏览器保存数据 永久保存 保存数据 localStorage [key] = value 保存数据 loca ...

  4. H5新特性---Web Worker---Web Stroage

    今天的目标 3.1:h5新特性八--Web Worker---代码就3行 程序:program 存储在外存(磁盘)中代码 进程:Process/Task 将程序调用内存中,分配空间 线程:Thread ...

  5. H5新特性——--第三方绘图工具库 echarts(canvas)---SVG绘图

    今天学习的内容 3.1:h5新特性---第三方绘图工具库 echarts(canvas) 百度 echarts;d3;two.js;.... 3.2:h5新特性---SVG绘图 3.2:h5新特性-- ...

  6. H5新特性-视频,音频-Flash-canvas绘图

    json格式 json - > AJAX json:数据格式,通常是以字符串形式表示 对象 {"name":"james","age" ...

  7. H5新特性实现对class的增删改

    直接撸代码 全靠死记硬背 没什么技术点 HTML部分 <!DOCTYPE html> <html lang="en"> <head> <m ...

  8. Atitti html5 h5 新特性attilax总结

    Atitti html5 h5 新特性attilax总结 Attilax觉得不错的新特性 3.语义Header和Footer (The Semantic Header and Footer) 8.占位 ...

  9. 使用h5新特性,轻松监听任何App自带返回键

    1.前言 如今h5新特性.新标签.新规范等有很多,而且正在不断完善中,各大浏览器商对它们的支持,也是相当给力.作为前端程序员,我觉得我们还是有必要积极关注并勇敢地加以实践.接下来我将和各位分享一个特别 ...

随机推荐

  1. sql 语句的先后执行顺序

    例:查询语句中select from where group by having order by的执行顺序 一般以为会按照逻辑思维执行,为: 查询中用到的关键词主要包含六个,并且他们的顺序依次为  ...

  2. 使用Java+Kotlin双语言的LeetCode刷题之路(三)

    BasedLeetCode LeetCode learning records based on Java,Kotlin,Python...Github 地址 序号对应 LeetCode 中题目序号 ...

  3. Linux下Vim使用备忘

    1.Insert键,决定是Insert模式还是Replace模式. 2.Esc键,退出编辑模式(Insert Or Replace). 3.:wq (ZZ) 保存并退出Vim. http://caib ...

  4. Eclipse: Difference between clean, build and publish

    https://stackoverflow.com/questions/5656989/eclipse-difference-between-clean-build-and-publish http: ...

  5. Character Encoding Issues for tomcat

    https://wiki.apache.org/tomcat/FAQ/CharacterEncoding#Q8 https://stackoverflow.com/questions/10936846 ...

  6. Linux初学笔记---关于进程管理等

    菜鸟初学: 1. 查看进程用的命令: ps 具体用法 ps -A ro ps -e 显示所有进程 ps -u root 显示root 用户的进程 ps -u root -N 显示非root用户的进程 ...

  7. js 实现List

    js 实现List 列表是一组有序的数据.每个列表中的数据项称为元素.在 JavaScript 中,列表中的元素可以是任意数据类型. 我们可以根据数组的特性来实现List. List 抽象数据类型定义 ...

  8. Systemed systemctl 创建服务 详解

    原文:http://www.ruanyifeng.com/blog/2016/03/systemd-tutorial-commands.html 一.由来 历史上,Linux 的启动一直采用init进 ...

  9. Migrate Maven Projects to Java 11

    Migrate Maven Projects to Java 11 So you want to migrate to Java 11 but your Maven project is still ...

  10. 自学Linux Shell13.3-获得用户输入(read命令)

    Bash shell提供了一些不同的方法来从用户处获得数据,包括以下3中方法: 命令行参数(添加在名利后面的数据) 命令行选项(可修改命令行为的单个字母)主要getopt.getopts命令 直接从键 ...