百度地图坐标转腾讯地图坐标

前端小白AAA

于 2025-03-18 16:27:28 发布

阅读量432

点赞数 3

文章标签：前端百度地图api

本文链接：https://blog.csdn.net/domnk/article/details/146344936

版权

缘由：写项目时最开始用了百度地图后面发现小程序上自带的map用腾讯地图比较好，但是坐标需要转换一下，所以就有了这个文章。

1安装：npm i vue-baidu-map@0.21.22

2使用：

main.js里：
import BaiduMap from 'vue-baidu-map';
Vue.use(BaiduMap, { ak: 'DaQoalwssjnrvpehNbgTUaVjghY8ZlH9' });

普通vue文件内使用：
<template>
<baidu-map></baidu-map>
</template>


文字转坐标方法：
    searchAddress(str) {
      // 同步获取地址位置
      return new Promise((res, rej) => {
        const geocoder = new window.BMap.Geocoder();
        geocoder.getPoint(
          str,
          (point) => {
            if (point) {
              // 更新地图中心点和标记位置
              res({ point });
            } else {
              rej(new Error(`无法解析地址：${str}`))
            }
          },
          // '天津市' // 指定城市以提高解析精度
        );
      })
    }

百度坐标转换腾讯坐标方法：
       const bdPoint = new window.BMap.Point(res.point.lng, res.point.lat);
       const convertor = new window.BMap.Convertor();
       convertor.translate([bdPoint], 5, 3, function (data) {
           console.log(data, '转换后的坐标')
       })

上面convertor.translate内的5与3对应的是下面这个图片