高德JSAPI获取当前所在位置的经度纬度
这是在浏览器中的效果:
控制台打印出来的就是经度纬度的值
代码如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>浏览器精确定位</title>
<link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
<style>
html,body,#container{
height:100%;
}
.info{
width:26rem;
}
</style>
<body>
<div id='container'></div>
<div class="info">
<h4 id='status'></h4><hr>
<p id='result'></p><hr>
<p >由于众多浏览器已不再支持非安全域的定位请求,为保位成功率和精度,请升级您的站点到HTTPS。</p>
</div>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.12&key=bc6ee21ecdcad5390e66cd92206a5f2c"></script>
<script type="text/javascript" src="https://www.w3cways.com/demo/vconsole/vconsole.min.js?v=2.2.0"></script> <script type="text/javascript">
var map = new AMap.Map('container', {
resizeEnable: true
});
AMap.plugin('AMap.Geolocation', function() {
var geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位,默认:true
timeout: 10000, //超过10秒后停止定位,默认:5s
buttonPosition:'RB', //定位按钮的停靠位置
buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
zoomToAccuracy: true, //定位成功后是否自动调整地图视野到定位点 });
map.addControl(geolocation);
geolocation.getCurrentPosition(function(status,result){
if(status=='complete'){
onComplete(result)
}else{
onError(result)
}
});
});
//解析定位结果
function onComplete(data) {
console.log(data.position.lng);
console.log(data.position.lat);
document.getElementById('status').innerHTML='定位成功'
var str = [];
str.push('定位结果:' + data.position);
str.push('定位类别:' + data.location_type);
if(data.accuracy){
str.push('精度:' + data.accuracy + ' 米');
}//如为IP精确定位结果则没有精度信息
str.push('是否经过偏移:' + (data.isConverted ? '是' : '否'));
document.getElementById('result').innerHTML = str.join('<br>');
}
//解析定位错误信息
function onError(data) {
document.getElementById('status').innerHTML='定位失败'
document.getElementById('result').innerHTML = '失败原因排查信息:'+data.message;
}
</script>
</body>
</html>
代码可以直接使用
高德JSAPI获取当前所在位置的经度纬度的更多相关文章
- ionic 获取手机所在位置
之前项目中需要使用到定位功能,前边的文章提到的坐标位置是有问题的,是国际坐标,国内的环境使用google地图会出现问题,所以需要使用国内的地图进行坐标解析,因为国内和国外的坐标体系不一致,需要通过转换 ...
- js通过高德地图获取当前位置的经度纬度
效果图如下: 已经获取到了经度纬度了 代码如下: <!doctype html> <html> <head> <meta charset="utf- ...
- IOS 正则表达式匹配文本中URL位置并获取URL所在位置(解决连接中文问题)
需求很简单,是从一段文本中匹配出其中的超链接.基本的做法就是用正则表达式去匹配.但是有这样一个问题. 网上大部分的识别URL的正则表达式url末尾有空格的情况下可以正确识别.比如这样的情况. 我是一段 ...
- 在微信小程序中将获取到的经纬度(经度纬度)转地址(地名)
var QQMapWX = require('qqmap-wx-jssdk') var qqmapsdk = new QQMapWX({ key: '填写你的key' // 必填 }) wx.getL ...
- android百度地图开发之自动定位所在位置与固定位置进行驾车,步行,公交路线搜索
最近跟着百度地图API学地图开发,先是学了路径搜索,对于已知坐标的两点进行驾车.公交.步行三种路径的搜索(公交路径运行没效果,待学习中),后来又 学了定位功能,能够获取到自己所在位置的经纬度,但当将两 ...
- android EditText插入字符串到光标所在位置
EditText mTextInput=(EditText)findViewById(R.id.input);//EditText对象 int index = mTextInput.getSelect ...
- H5高德地图获取当前位置
<!doctype html> <html> <head> <meta charset="utf-8"> <meta http ...
- js调用高德API获取所在当前城市
可以在js代码中直接调用API接口,获取所处当前城市信息,代码如下: <script type="text/javascript"> function getCurre ...
- vba中获取当前sheet页的名称,当前单元格所在位置
fname = ActiveSheet.Name-------获取当前sheet页的名称 Sname = "" & fname & "&qu ...
随机推荐
- Spring Boot(二):数据库操作
本文主要讲解如何通过spring boot来访问数据库,本文会演示三种方式来访问数据库,第一种是JdbcTemplate,第二种是JPA,第三种是Mybatis.之前已经提到过,本系列会以一个博客系统 ...
- pragma警告处理
使用pragma消除警告 (绝不可强行消除,因为有可能是个运行时错误) #pragma clang diagnostic push #pragma clang diagnostic ignored & ...
- 相似度度量:欧氏距离与余弦相似度(Similarity Measurement Euclidean Distance Cosine Similarity)
在<机器学习---文本特征提取之词袋模型(Machine Learning Text Feature Extraction Bag of Words)>一文中,我们通过计算文本特征向量之间 ...
- emwin之在中断服务程序中创建窗口的结果
@2019-04-28 [小记] 使用emwin设计器生成的程序,将该窗口创建放在中断服务程序中出现奇怪现象,非死机但功能间歇性异常,将创建窗口程序放于普通程序中则工作正常
- 数据库MySQL——安装
MySQL 安装 Mysql安装: 1.通过二进制的方式安装 二进制安装方式中,包括rpm版本以及glibc版本. rpm版本就是在特定linux版本下编译的,如果你的linux版本匹配,就可以安装; ...
- SVG矢量图学习实例
从W3school上学习了一下SVG矢量图形,感觉和HTML相比还是有一些新的元素和属性的,一时间不能全部记住,特此留下笔记,供遗忘时作为参考 <!DOCTYPE html> <!- ...
- Spring Boot学习总结四
利用阿里的druid来管理数据库连接池,在此数据上针对多数据源的情况,做下讲解.首先加上该包 <dependency> <groupId>com.alibaba</gro ...
- Java:IO流-流的操作规律和转换流
首先我们先来了解一些IO流基本知识. 一,基本知识概括 具体的IO流有很多种,针对不同的应用场景应该使用相应的流对象.但怎么确定应该使用哪个IO流对象呢? 一般要有四个明确: 1)明确源和目的 源:I ...
- mysql 严格模式 Strict Mode说明(text 字段不能加默认或者 不能加null值得修改方法)
mysql 严格模式 Strict Mode说明 1.开启与关闭Strict Mode方法找到mysql安装目录下的my.cnf(windows系统则是my.ini)文件 在sql_mode中加入ST ...
- 序列化 反序列化 MessagePack for C#
阅读目录 快速序列化组件MessagePack介绍 简介 使用 快速开始 分析器 内置的支持类型 对象序列化 DataContract兼容性 序列化不可变对象(序列化构造器) 序列化回调 Union ...