第一步 ： 現在高德地圖的官網上申請key
第二部 ： 在index.html中引入
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.3&key=your key"></script>
第三步 ： 新建一個map.js
/**
* 高德地圖定位
* @type {{}}
*/
export const location = {
initMap (id) {
let mapObj = new AMap.Map(id, {})
let geolocation;
mapObj.plugin(['AMap.Geolocation'], function () {
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, 20), // 定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10, 20)
showMarker: true, // 定位成功后在定位到的位置顯示點標記，默認：true
showCircle: true, // 定位成功后用圓圈表示定位精度范圍，默認：true
panToLocation: true, // 定位成功后將定位到的位置作為地圖中心點，默認：true
zoomToAccuracy: true// 定位成功后調整地圖視野范圍使定位位置及精度范圍視野內可見，默認：false
})
mapObj.addControl(geolocation)
geolocation.getCurrentPosition()
})
return geolocation
}
}
第四步：在你需要獲取位置信息的頁面（home.vue）
import {location } from 'map.js'
methods ：{
refreshBtn(){
let _that = this;
let geolocation = location.initMap("map-container"); //定位
AMap.event.addListener(geolocation, "complete", result => {
let data = {
"user_id": "systemId", //賦值systemId，必須
"eventTypeId": api.global.eventTypeId,
"longitude": result.position.lng, //類型：Number 必有字段 備注：經度
"latitude": result.position.lat
}
api.queryRecentProject(data).then(res=> {
if(res.data.Result == 'success'){
_that.projectName = res.data.Item.project_local_name
}
})
});
},
}