js 移动端获取当前用户的经纬度
一、HTML5 geolocation的属性
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(onSuccess , onError);
}else{
alert("您的浏览器不支持使用HTML 5来获取地理位置服务");
}
//定位数据获取成功响应
function onSuccess(position){
alert('纬度: ' + position.coords.latitude + '\n' +
'经度: ' + position.coords.longitude + '\n' +
'海拔: ' + position.coords.altitude + '\n' +
'水平精度: ' + position.coords.accuracy + '\n' +
'垂直精度: ' + position.coords.altitudeAccura)
}
//定位数据获取失败响应
function onError(error) {
switch(error.code)
{
case error.PERMISSION_DENIED:
alert("您拒绝对获取地理位置的请求");
break;
case error.POSITION_UNAVAILABLE:
alert("位置信息是不可用的");
break;
case error.TIMEOUT:
alert("请求您的地理位置超时");
break;
case error.UNKNOWN_ERROR:
alert("未知错误");
break;
}
}
二、百度地图api定位
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=xxxxxxxxxx"></script>
<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
<script>
window.BMap = BMap;
let BMap = window.BMap
let geolocation = new BMap.Geolocation() geolocation.enableSDKLocation(); //允许SDK辅助
geolocation.getCurrentPosition(function (r)
{
if(this.getStatus() == 0){
console.log(r)
}
})
</script>

相关文章:HTML5获取地理经纬度并通过百度接口得到实时位置
三 、腾讯地图api定位
<iframe id="geoPage" width=0 height=0 frameborder=0 style="display:none;" scrolling="no"
src="https://apis.map.qq.com/tools/geolocation?key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&referer=myapp">
</iframe>
window.addEventListener('message', function(event) {
// 接收位置信息
var loc = event.data;
console.log('location', loc);
}, false) ;
setTimeout(function() {
if (!_this.loc) {
console.log('定位超时')
}
}, 6000) // 6s为推荐值,业务调用方可根据自己的需求设置改时间,不建议太短

js 移动端获取当前用户的经纬度的更多相关文章
- 百度地图JavaScript API获取用户当前经纬度和详细地理位置,反之通过详细地理位置获取当前经纬度
前言: 前端时间刚好使用了百度地图的js api定位获取用户当前经纬度并获取当前详细位置和通过当前用户详细地理位置换取用户当前经纬度坐标的功能,为了方便下次找起来方便一些自己在这里记录一下,希望也能够 ...
- js调用百度地图接口绘制任意多边形并获取每个点的经纬度等
来自:https://blog.csdn.net/u013239236/article/details/52213977 侵删 <!DOCTYPE html> <html> & ...
- Vue.js 服务端渲染业务入门实践
作者:威威(沪江前端开发工程师) 本文原创,转载请注明作者及出处. 背景 最近, 产品同学一如往常笑嘻嘻的递来需求文档, 纵使内心万般拒绝, 身体倒是很诚实. 接过需求,好在需求不复杂, 简单构思 后 ...
- flexible.js 移动端自适应方案
一,flexible.js 的使用方式: github地址:https://github.com/amfe/lib-flexible 官方文档地址:https://github.com/amfe/ar ...
- 有了这套flexible.js 移动端自适应方案,你就能在移动端的来去自如, (*^__^*)
flexible.js 移动端自适应方案 一,flexible.js 的使用方式: github地址:https://github.com/amfe/lib-flexible 官方文档地址:https ...
- Atitit 项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx
Atitit 项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx 1. 场景:应用在项目列表查询场景下1 1.1. 预计初步掌握vue ...
- 小白学react之网页获取微信用户信息
通过上一篇<小白学react之EJS模版实战>我们学习了怎样通过EJS模版生成我们高定制化的index.html文件. 本篇我们将会继续延续我们的alt-tutorial项目的实战计划.去 ...
- 与安卓联调,调用安卓那边的方法,获取到安卓传过来的数据,再携带这些数据发送axios请求,获取到用户的信息
第一步:js调用Android方法:接收Android传递过来的数据,并做处理 //参数一:调用java中的方法 submitFromWeb是方法名,必须和Android中注册时候的方法名称保持一 ...
- 使用腾讯开发平台获取QQ用户数据资料
<今天是七夕:祝大家七夕嗨皮,前可么么哒,后可啪啪啪> Tips:本篇博客将教你如何使用腾讯开发平台获取QQ用户资料 ----------------------------------- ...
随机推荐
- 本周MySQL官方verified的bug列表(11月1日至11月7日)
本周MySQL verified的bug列表(11月1日至11月7日) 1.Bug #70839JSON_VALID allows to have two elements with the same ...
- android安装前期遇到的问题
1.安装的eclipse与对应的java版本位数要一致,要么32位,要么64位. 2.关于新版ADT创建项目时出现appcompat_v7的问题 更新ADT至22.6.0版本之后,创建新的安装项目,会 ...
- 关于Safari浏览器使用的几点总结
声明:下载的是Safari英文版本,在Windows操作系统下使用. 一.Safari浏览器中的开发者调试工具隐藏得比较深,找了好久才找到的,方法:按一下键盘上的alt键,浏览器上方就会弹出一个开发者 ...
- 我的border能自定义四角之border-radius : 左上角,右上角,左下角,右下角。
1 边框:border: 1px solid #0081df; 2 想要单独加上四个圆角: border-bottom-left-radius: 5px; border-top-left-radius ...
- (DP)uva 10036 Problem C: Divisibility
链接: http://acm.hust.edu.cn/vjudge/contest/view.action?cid=88171#problem/F 代码: #include <cstdio> ...
- OpenGL中的像素包装理解
OpenGL中的像素包装理解 像素包装 位图和像素图很少会被紧密包装到内存中.在许多硬件平台上,考虑到性能的原因位图和像素图的每一行的数据会从特殊的字节对齐地址开始.绝大多数编译 器会自动把变量和缓冲 ...
- java中的四种代码块
一.普通代码块 直接在一个方法中出现的{}就称为普通代码块,例子程序如下: public class CodeDemo01{ public static void main(String[] args ...
- Postgresql 9.6 搭建 异步流复制 和 同步流复制 详细教程
Basic Replication If you’re feeling overwhelmed, try setting up a slave to see how easy it is! We’ll ...
- Solr之functionQuery(函数查询)
Solr函数查询 让我们可以利用 numeric域的值 或者 与域相关的的某个特定的值的函数,来对文档进行评分. 怎样使用函数查询 这里主要有两种方法可以使用函数查询,这两种方法都是通过solr ht ...
- Orchard 介绍
0.Introduction 下载地址 https://orchard.codeplex.com/ Orchard 是由微软公司创建,基于 ASP.NET MVC 技术的免费开源内容管理系统: 可用于 ...