要在Vue2中
使用高德地图对地图添加
GPS定位，可以按照以下步骤进行：
1. 首先，在Vue项目中引入
高德地图JavaScript API的SDK，并在页面中添加地图容器。
2. 在Vue组件中
使用AMap对象的
定位插件AMap.Geolocation获取用户的位置信息，并将地图中心移动到用户当前位置。
以下是示例代码：
```
<template>
<div id="map-container"></div>
</template>
<script>
export default {
mounted() {
// 初始化地图对象
const map = new AMap.Map('map-container', {
zoom: 14
});
//
使用定位插件获取用户位置信息
map.plugin('AMap.Geolocation', function() {
const geolocation = new AMap.Geolocation({
enableHighAccuracy: true, // 是否
使用高精度
定位，默认:true
timeout: 10000, // 超过10秒后停止
定位，默认：无穷大
maximumAge: 0, //
定位结果缓存0毫秒，默认：0
convert: true, // 自动偏移
坐标，偏移后的
坐标为高德
坐标，默认：true
showButton: true, // 显示
定位按钮，默认：true
buttonPosition: 'LB', //
定位按钮停靠位置，默认：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 60), //
定位按钮距离容器底部/右侧的像素距离，默认：Pixel(10, 20)
showMarker: true, //
定位成功后在
定位到的位置显示点标记，默认：true
showCircle: true, //
定位成功后用圆圈表示
定位精度范围，默认：true
panToLocation: true, //
定位成功后将
定位到的位置作为地图中心点，默认：true
zoomToAccuracy: true //
定位成功后自动调整地图缩放级别以适应
定位精度范围，默认：true
});
map.addControl(geolocation);
geolocation.getCurrentPosition(function(status, result) {
if (status === 'complete') {
//
定位成功，将地图中心移动到用户当前位置
map.setCenter([result.position.lng, result.position.lat]);
} else {
//
定位失败
console.log('
定位失败');
}
});
});
}
}
</script>
```
在上面的示例代码中，我们首先初始化了一个地图对象，然后在组件的mounted生命周期函数中
使用AMap.Geolocation插件获取用户位置信息，并将地图中心移动到用户当前位置。注意，需要在组件中引入
高德地图JavaScript API SDK，并在页面中添加地图容器。
最低0.47元/天 解锁文章
1380
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
