百度地图 坐标转换

Vue 项目 使用百度地图

一、安装

npm i --save vue-baidu-map

二、引入插件 main.js

Vue.use(BaiduMap, {
  // ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */
  ak: ''
})

三、使用

<baidu-map class="bm-view" :center="center" :zoom="18" @ready="handleReadyMap">
        <bm-marker :position="center" :icon="{url: require('../../assets/position.png'), size: {width: 139, height: 139}}"/>
</baidu-map>
// handleReadyMap 初始化地图
// center中心点坐标
// zoom 放大比例

注:如发现定位有变差,可设置偏移值,如需要将其他坐标转为百度坐标,可按照以下操作(本文将腾讯坐标转为百度):

    handleReadyMap({BMap, map}){
    //  传入坐标值
        var ggPoint = new BMap.Point(lng,lat);
        let geoCoder = new BMap.Convertor();
        var pointArr = [];
        pointArr.push(ggPoint);
        geoCoder.translate(pointArr, 1, 5, this.translateCallback)
    },
    /* 腾讯坐标转为百度 */  
    translateCallback(data){
      this.center.lng = data.points[0].lng
      this.center.lat = data.points[0].lat
    },

猜你喜欢

转载自blog.csdn.net/weixin_45474673/article/details/123484073