最悲剧的HTML5 API : Position地理位置
Position API接口
注意:由于geolocation的位置信息来源包括GPS,IP地址,wifi,蓝牙的MAC地址GSM/CDMA 卡 ID 等。移动设备优先使用GPS获取位置,但是对于wifi和IP定位,浏览器本身不能直接解析,它只能手机wifi和ip的信息,然后通过请求位置信息服务接口来获取,然后主流浏览器都是使用Google提供的地理位置查询服务。通过抓包我们可以知道浏览器会请求www.googleapis.com来获取位置信息,那么问题来了,谷歌撤出中国以后,很多Google提供的服务我们无法使用,其中就包括了地理位置查询服务,悲剧!
不过我们还是有必要来学习一下这个最受开发者青睐的API。
方法1:getCurrentPosition() 获取用户当前的位置信息,有三个参数,1.成功后的回调函数,2.失败后的回调函数,3,设置参数的对象。
方法2:watchCurrentPostion() 获取用户的位置信息,并继续返回用户移动时的更新位置,函数会返回一个 ID,唯一地标记该位置监视器。您可以将这个 ID 传给 clearWatch() 函数来停止监视用户位置。
方法3:clearWatch(id) 取消watchCurrentPostion,参数为watchID。
getCurrentPosition()使用案例
if(navigator.geolocation){
//可用
//设置配置参数
getLocationOptions = {
// 指示浏览器获取高精度的位置,默认为false
enbaleHighAcuracy:true,
// 指定获取地理位置的超时时间,默认不限时,单位为毫秒
timeout:5000,
// 最长有效期,在重复获取地理位置时,此参数指定多久再次获取位置。
maximumAge:300
};
navigator.geolocation.getCurrentPosition(getLocationSuccess,getLocationError,getLocationOptions);
}
else{
//不可用
alert('你的浏览器不支持geolocation API的使用');
}
//成功后返回对象,包含位置信息
function getLocationSuccess(position){
console.log('纬度:'+position.coords.latitude);
console.log('经度:'+position.coords.longitude);
console.log('位置精度:'+position.coords.accuracy);
console.log('海拔:'+position.coords.altitude);
console.log('海拔精度:'+position.coords.altitudeAccuracy);
console.log('方向(正北开始以度计):'+position.coords.heading);
console.log('速度,以米/每秒计'+position.coords.speed);
console.log('响应的日期/时间'+position.timestamp);
}
//失败后返回对象,包含失败信息
function getLocationError(error){
switch (error.code){
case error.PERMISSION_DENIED : alert('用户拒绝浏览器获取位置信息');break;
case error.TIMEOUT : alert('请求超时!'); break;
case error.POSITION_UNAVAILABLE : alert('无法检测到你的位置'); break;
}
}
watchCurrentPostion()使用案例
var watchID = navigator.geolocation.watchPosition(function(position) { /*.....*/});
clearWatch(id)使用案例
navigator.geolocation.clearWatch(watchID);
最悲剧的HTML5 API : Position地理位置相关推荐
- 最实用的18个HTML5 API 教程大全,都在这里了
HTML5是web前端开发者必备的能力之一,公众号之前已经给同学们带来很多相关的教程,现在小编在这里将所有的API教程进行一次汇总,方便同学们学习. API详解1:实现fullscreen全屏模式 A ...
- html5实现获取地理位置信息并定位
html5实现获取地理位置信息并定位 一.总结 一句话总结:获取地理位置是分两步:获取经纬度和根据经纬度获取地址信息 a.HTML5的Geolocation(地理位置功能(Geolocation AP ...
- html5中获取地理位置信息
HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用.本文结合实例给大家分享如何使用HTML5,借助百度.谷歌地 ...
- HTML5基础扩展——地理位置、本地存储、缓存
HTML5扩展,继上两篇博客,我们来看一下HTML5的一些扩展的功能,由于HTML5更多是为了兼容电脑浏览器,安卓浏览器,苹果浏览器更多浏览器,或者说为这些浏览器提供一个统一的标准.因此目前在手机上的 ...
- c语言api获取百度地图,H5调用百度地图API获取地理位置
//获取当前位置 var geolocation = new BMap.Geolocation(); geolocation.getCurrentPosition(function(r){ alert ...
- HTML5 基础知识,第 3 部分 HTML5 API 之应用-介绍HTML5 API 的用法和价值,Canvas 提供的创造性,以及Web storage的离线应用
HTML5 集设计者和开发者于一身,其主要任务就是构建高效的丰富 Internet 应用程序之富网络应用 (Rich Internet Application,简称RIA),尤其是富 UI(User ...
- html5扫码plusready子添加剂,关于HTML5+ API plusready的兼容问题
这篇文章主要介绍了HTML5+ API plusready的兼容问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下 Android平台提前注入5+ API, ...
- html5扫码plusready子添加剂,HTML5+ API plusready兼容相关问题
这篇文章主要介绍了HTML5+ API plusready的兼容问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下 Android平台提前注入5+ API, ...
- html5 判断获取定位,HTML5利用Geolocation API获取地理位置定位功能
如何使用html5地理位置定位功能 定位功能(Geolocation)是HTML5的新特性,因此只有在支持HTML5的现代浏览器上运行,特别是手持设备如iphone,地理定位更加精确.首先我们要检测用 ...
最新文章
- 数据仓库与联机分析处理
- 操作dict时避免出现KeyError的几种方法
- 深入解读EOS源代码之——区块链内核
- 5如何让进行项目管理
- [转]Windows Shell编程 第十五章【来源:http://blog.csdn.net/wangqiulin123456/article/details/7988016】...
- alter procedure是什么意思_板上钉钉的意思
- 安装Flutter环境
- 大数据应用的优势在哪
- 阿里P7的大数据简历,牛逼!
- 迭代重心法 matlab,重心法
- org.springframework.beans.BeanInstantiationException: Failed to instantiate [com.itheima.
- 古诗词取名小工具1.0
- python 跳过_如果文件已经存在,Python将跳过一个函数
- UWB,可以应用到生活中的方方面面
- iPhone SDK 包含哪些东西?
- UI自动化执行遇到的问题汇总
- 女人嫁错人,但又离不了婚,过来人告诉你该怎么办
- mac聚焦搜索Spotlight怎么用
- 电子尺子怎么在线测量?几个步骤轻松测量
- Cxcore绘图函数