vue 高德地图API根据地址获取经纬度/根据经纬度获取地址

 1.引入

2.初始化地图

      let that = this;

      that.map = new AMap.Map('carContainer', {

        resizeEnable: true,

      })

      // 为地图注册click事件获取鼠标点击出的经纬度坐标

      that.map.on('click', function (e) {

        var lnglatXY = [e.lnglat.getLng(), e.lnglat.getLat()];

        that.init(lnglatXY)

      });

3.地址获取经纬度

let _this = this;

      window.AMap.plugin('AMap.PlaceSearch', function () {

        var autoOptions = {

          city: '全国',

          map: _this.map, // 展现结果的地图实例

          pageSize: 1, // 单页显示结果条数

          pageIndex: 1, // 页码

          autoFitView: true // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围

        };

        var placeSearch = new window.AMap.PlaceSearch(autoOptions);

        placeSearch.search(_this.formInline.text, function (status, result) {

          // 搜索成功时，result即是对应的匹配数据

          if (status == 'complete') {

            if (result.poiList.pois.length = 0) {

              ElMessage.error('没有查询到对应的地址');

            }else{    

                 let lng = result.poiList.pois[0].location.lng;

                 let lat = result.poiList.pois[0].location.lat

            }

          } else if (status == 'no_data') {

            ElMessage.error('没有查询到对应的地址');

          }

        });

      });

4.经纬度获取地址

AMap.plugin('AMap.Geocoder', function () {

        var geocoder = new AMap.Geocoder({

          radius: 1000,

          extensions: "all"

        });

        geocoder.getAddress(lnglatXY, function (status, result) {

          if (status === 'complete' && result.info === 'OK') {

            var address = result.regeocode.formattedAddress;

            that.address = address  //兑换地址

            that.$emit('getaddress', that.address, lnglatXY)

          } else {

            ElMessage.error('无地址，请重新选择');

          }

        });

        // 清除所有标记

        that.map.clearMap();

        var marker = new AMap.Marker();

        that.map.add(marker);

        marker.setPosition(lnglatXY);

      })

 完整代码