百度地图在vue中的使用：获取当前位置的经纬度
1.在html页面引入<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=百度地图密钥"></script>
2. 在当前页面中的js中获取：
<script>
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r) {
//输出经纬度
console.log(r.point)
if (this.getStatus() == BMAP_STATUS_SUCCESS) {
console.log('您的位置：' + r.point.lng + ',' + r.point.lat);
} else {
alert('failed' + this.getStatus());
}
}, {
enableHighAccuracy: true
})
</script>
3.报错信息及解决办法
在项目跟src平级的目录下添加一个vue.config.js的配置文件，将如下代码粘贴进去：
module.exports = {
// 百度地图的引入
configureWebpack: {
externals: {
'BMap': 'BMap',
// 'BMap_Symbol_SHAPE_POINT': 'BMap_Symbol_SHAPE_POINT' 若没有格式报错则加上
}
}
}
4. 在生命周期函数中获取位置经纬度
mounted() {
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(
function (r) {
//输出经纬度
console.log(r.point);
},
{ enableHighAccuracy: true }
);
}
