vue使用百度地图获取可视区域四角坐标（百度地图四角坐标，百度地图3D可视区域四角坐标）-Toy模板网

这篇具有很好参考价值的文章主要介绍了vue使用百度地图获取可视区域四角坐标（百度地图四角坐标，百度地图3D可视区域四角坐标）。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

百度地图api只提供了左下角和右上角两个坐标，左上角坐标和右下角坐标需要自己操作获取，方法如下：

        地图自带获取坐标的方法：

        var bounds = map.getBounds(); //获取地图可视区域

        //左下
        var sw = bounds.getSouthWest(); //获取西南角的经纬度(左下角)

        //右上
        var ne = bounds.getNorthEast(); //获取东北角的经纬度(右上角)





        根据地图自带坐标（左下和右上）获取剩下两个角（左上和右下）坐标：


        //其实很简单，就是拿左下角的经度加上右上角的维度就是左上角的坐标
        //这里取的是sw的经度和ne的维度（3D地图可直接赋值）
        //左上
        var wn = new BMap.Point(sw.lng, ne.lat);


        //其实很简单，就是拿右上角的经度加上左下角的维度就是右下角的坐标
        //这里取的是ne的经度和sw的维度（3D地图可直接赋值）
        //右下
        var es = new BMap.Point(ne.lng, sw.lat);

然后在地图上添加监听事件，

这样用户在拖拽或缩放地图时也可以获取到地图可视区域的四角坐标：

      //图添拖拽事件
      this.map.addEventListener("dragend", (e) => {
          //执行事件
      });

      //地图缩放事件
      this.map.addEventListener("zoomend", (e) => {
          //执行事件
      });

创作不易，感觉有用就一键三连，感谢(●'◡'●)文章来源地址https://www.toymoban.com/news/detail-505727.html

到了这里，关于vue使用百度地图获取可视区域四角坐标（百度地图四角坐标，百度地图3D可视区域四角坐标）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！