amap 实现获取定位功能（高德api）

注册账号并申请key

高德开发平台

引入

public目录下index.html中通过src引入插件

<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=xxxxx"></script>

使用

let AMap = window.AMap
AMap.plugin('AMap.Geolocation', function() {var geolocation = new AMap.Geolocation({// 是否使用高精度定位，默认：trueenableHighAccuracy: true,// 设置定位超时时间，默认：无穷大timeout: 10000,// 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)buttonOffset: new AMap.Pixel(10, 20),//  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：falsezoomToAccuracy: true,panToLocation: true,//  定位按钮的排放位置,  RB表示右下buttonPosition: 'RB'})

geolocation.getCurrentPosition()
AMap.event.addListener(geolocation,‘complete’,onComplete)
AMap.event.addListener(geolocation, ‘error’, onError)

function onComplete(data) {
// data是具体的定位信息
console.log(data)
if (data.formattedAddress) {
console.log(data.formattedAddress)
} else {
console.log(‘获取定位失败’)
}
}
function onError(data) {
// 定位出错
console.log(‘获取定位失败’)
}
})

常见问题
温馨提示：Google浏览器调试过程中需要开启HTTPS服务，否则可能会出现一直定位失败的问题，详细解释参考官方详细说明
官方定位示例链接
官方常见问题链接

amap 实现获取定位功能（高德api）相关推荐

uniapp小程序获取定位（高德SDK)
由于uniapp自带的getlocation方法不支持解析地址,所以这里记录下使用高德sdk的方法首先登陆高德开放平台登录/注册后打开控制台,在应用管理里创建新应用然后点击添加按钮,添加key ...
uniapp App端后台间隔时间发送定位功能实现
文章目录前言一.核心api 二.代码实现 1.locationWatcher.js: 2.页面引用运行结果三.注意事项前言 uniapp开发app端时候,某些业务场景需求:在后台不间断(间隔 ...
【Android App】定位导航GPS中开启手机定位功能讲解及实战（附源码和演示超详细）
需要源码请点赞关注收藏后评论区留言私信~~~ 一.开启定位功能手机定位分为卫星定位和网络定位两大类. (1)卫星定位卫星定位服务由几个全球卫星导航系统提供. 卫星定位的原理是根据多颗卫星与导航芯片 ...
ios 高德获取定位_解决ios11不支持高德地图API定位功能的方法
在 iOS 11 系统上访问JS API定位业务失败怎么解决? 苹果新发的 iOS 11 操作系统的一大特性是对 http 形式访问页面的限制变得非常严格(相比iOS 10 和 iOS 9).高德提供 ...
iOS获取高德地图实现持续定位功能
首先,根据高德地图开发平台在Xcode里面配置相应的环境自动部署用cocoapods,请按照http://lbs.amap.com/api/ios-location-sdk/guide/create ...
android中高德地图定位功能并且获取定位的城市
一.概述今天再一次用到了地图定位功能和地图显示功能,以前一直用的是高德地图定位,这次还是用高德,记录一下以便以后再做时方便一些.因为业务需要的功能不是很全,可以参考https://www.2cto. ...
用高德js api做h5定位功能
定位失败?what 最近项目中有一需求要实现手机定位当前城市功能, 查了高德地图api,根据文档说明很快就做出来了. AMap.plugin('AMap.CitySearch', function ( ...
vue使用高德api 定位获取位置信息 positionLocation.js及 USERKEY_PLAT_NOMATCH报错
前提假设你已经申请好了高德api 及对应的高德api业务,申请高德api 配置相关步骤不在这里敷述,自行百度相关博文配置: build/webpack.base.conf.js 要配置 co ...
微信小程序调用高德api定位当前经纬度，根据城市名获取对应经纬度
最近写小程序有一个首页关于定位功能,指定高德API,话不多说,上图: 首先小程序需要先设置定位提示语,在mainfest.json中添加配置scope.userLocation: "mp-w ...

amap 实现获取定位功能（高德api）

amap 实现获取定位功能（高德api）相关推荐

最新文章

热门文章