navigator. geolocation.getCurrentPosition()

触发浏览器弹窗询问用户同意访问地址。接收三个参数:成功回调函数,可选的失败回调,可选选项对象

 

成功回调函数接受一个地址对象作为唯一的参数,该对象有两个属性,coords和timestamp.

 

coords一定包含latitude,longitude,和accuracy。可选的altitude,altitudeAccuracy,heading,speed

 

最常用是画出用户地点:
navigator.geolocation.getCurrentPosition(function(position){
drawMapCenteredAt(position.coords.latitude, positions.coords.longitude);
});

 
 

失败回调函数也接受一个参数,也是一个对象,上面有两个属性:message和code。message是让人看的错误信息。code是失败类型:1代表用户拒绝,2代表地址不可用,3超时。

 

最后,可选对象可以设置是否获取最精确地支,最长等待时长,上次地址有限时间
navigator.geolocation.getCurrentPosition(function(position){
drawMapCenteredAt(position.coords.latitude, positions.coords.longitude);
}, function(error){
console.log(“Error code: “ + error.code);
console.log(“Error message: “ + error.message);
}, {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 25000
});

 

如果想跟踪用户地点,那么可以用watchPosition()方法,和 getCurrentPosition接受同样的三个参数。该方法首先执行一次,然后等待系统通知地点改变再执行。返回一个identifier用来结束。
var watchId = navigator.geolocation.watchPosition(function(position){
drawMapCenteredAt(position.coords.latitude, positions.coords.longitude);
}, function(error){
console.log(“Error code: “ + error.code);
console.log(“Error message: “ + error.message);
});
clearWatch(watchId);

geolocation h5的更多相关文章

  1. js浏览器对象模型(BOM)

    浏览器对象模型(Browser Object Model,BOM):浏览器为js提供的对象集合. 1 windows对象 windows对象:表示浏览器的框架以及与其相关的内容,比如滚动条和导航栏图标 ...

  2. H5 Notes:Navigator Geolocation

    H5的地理位置API可以帮助我们来获取用户的地理位置,经纬度.海拔等,因此我们可以利用该API做天气应用.地图服务等. Geolocation对象是我们获取地理位置用到的对象. 首先判断浏览器是否支持 ...

  3. H5学习系列之Geolocation API

    获取位置信息途径: 1.IP地址地理定位数据 2.GPS地理定位数据 3.WI-FI地理定位数据 4.手机地理定位数据 无废话直接上重点:navigator.geolocation对象就是获取地理位置 ...

  4. H5新特性之geolocation

    geolocation是H5新增的对象,它用于定位,继承在navigator对象内,以前用navigator只用到userAgent,现在就多了这个geolocation 有2种方法(getCurre ...

  5. 获取定位,苹果IOS10以上不支持h5的geolocation获取不到地理位置信息解决办法

    今天开发应用,获取地理位置,最先采用H5的Geolocation的方法来获取地理位置,经过测试发现安卓的机子可以,但是IOS的就是不行,一查资料才知道:10.0苹果版本需要协议为https的才可以获取 ...

  6. 【H5】 经纬度位置获取navigator.geolocation.getCurrentPosition

    navigator.geolocation.getCurrentPosition(function(){})经度 : coords.longitude 纬度 : coords.latitude 准确度 ...

  7. 07. Web大前端时代之:HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  8. H5天气查询demo(二)

    最近刚好有空,学长帮忙让做个毕设,于是我提到了那个基于H5地理位置实现天气查询的方法,学长听了也觉得不错,于是就这个主题,扩展了一下,做了一个航班管理查询系统,为上次博客中提到的利用H5 api中的经 ...

  9. Web API接口之Geolocation

    0.关于Geolocation Geolocation,地理位置API.用于获取用户的位置信息.它不算是现有的HTML5标准的“直系”成员,但是是W3C的一个标准.它几乎就是一个真正的JavaScri ...

随机推荐

  1. 针对Openlayer3官网例子的简介

    网址:http://openlayers.org/en/latest/examples/ 如果大家想了解ol3能做什么,或者说已提供的API有什么,又闲一个个翻例子跟API累的话,就看看这个吧. 1. ...

  2. hadoop 基本命令

    hdfs相关 1.查看HDFS文件目录 hadoop fs -ls / mapreduce相关 1.查看mapred job mapred job -list hadoop job -list Use ...

  3. bzoj3209 花神的数论题 (二进制数位dp)

    二进制数位dp,就是把原本的数字转化成二进制而以,原来是10进制,现在是二进制来做,没有想像的那么难 不知到自己怎么相出来的...感觉,如果没有一个明确的思路,就算做出来了,也并不能锻炼自己的能力,因 ...

  4. pycharm(windows)安装及其设置中文菜单

    pycharm(windows)安装及其设置中文菜单 1.下载 在官网(http://www.jetbrains.com/pycharm/download/#section=windows)进行下载 ...

  5. Redis “瘦身”指南

    code[class*="language-"], pre[class*="language-"] { background-color: #fdfdfd; - ...

  6. java web Servlet学习笔记-2 请求重定向和请求转发的区别

    请求转发与请求重定向的区别 请求重定向和转发 1.请求重定向:浏览器的行为(通过响应对象HttpServletResponse来执行) 特点:可以重新定向访问其他Web应用下的资源 浏览器发出了2次请 ...

  7. [js插件开发教程]一步步开发一个可以定制配置的隔行变色小插件

    隔行变色功能,不用js,直接用css伪类就可以做,这个实例可以作为js插件开发很好的入门级实例.本文实现的隔行变色包括以下功能: 1,支持2种常用结构共存( div元素 和 表格类型 ) 2,一个页面 ...

  8. 安装Extended WPF Toolkit

    Extended WPF Toolkit 可以说是WPF Toolkit 的一个补充,也包含了许多WPF 控件供开发者使用.本篇将介绍Extended WPF Toolkit 1.4.0 中新增的一些 ...

  9. BitmapImage 读取内存流和显示图片

    FileStream filestream = File.OpenRead(@"C:\Users\Administrator\Desktop\queryHeaderImg.png" ...

  10. java优雅的使用elasticsearch api

    本文给出一种优雅的拼装elasticsearch查询的方式,可能会使得使用elasticsearch的方式变得优雅起来,使得代码结构很清晰易读. 建立elasticsearch连接部分请参看另一篇博客 ...