uni-app 集成高德地图拖动地图获取地址列表时报错

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app 集成高德地图拖动地图获取地址列表时报错

代码示例

plus.maps.Map.reverseGeocode(point, {}, (event) => {  
    console.log(JSON.stringify(event))  
    var address = event.address; // 转换后的地理位置  
    var point = event.coord; // 转换后的坐标信息  
    var coordType = event.coordType; // 转换后的坐标系类型  
    var reg = /.+?(省|市|自治区|自治州|县|区)/g;  
    var addressList = address.match(reg).toString().split(",");  
    //注意 因为存在直辖市, 当所在地区为普通省市时,addressList.length == 3,city = addressList[1];当所在地区为直辖市时addressList.length == 2,city = addressList[0];  
    // that.cityName = addressList.length == 3?addressList[1]:addressList[0];  
    console.log(addressList);  
},  
function(e) {  
    console.log("失败回调", e);  
}  
);

报错信息

{
    "code": -100,
    "message": "[Maps高德地图:1008]未知错误, http://lbs.amap.com/api/android-sdk/guide/error/"
}

1 回复

在处理 uni-app 集成高德地图并尝试在拖动地图时获取地址列表时遇到报错的问题,通常可能是由几个常见原因引起的,包括但不限于地图SDK的集成问题、事件监听器的设置不当、或是数据处理错误等。下面是一个基本的代码示例,展示了如何在 uni-app 中集成高德地图,并监听地图拖动事件以获取地址列表。请注意,这只是一个起点,具体实现可能需要根据实际报错信息和项目需求进行调整。

首先,确保你已经在 manifest.json 中添加了高德地图的SDK配置:

"mp-weixin": {
  "appid": "your-app-id",
  "setting": {
    "urlCheck": false
  },
  "usingComponents": true,
  "permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    }
  },
  "plugins": {
    "myPlugin": {
      "version": "1.0.0",
      "provider": "wxa8c179748d68xxxx" // 高德地图插件的appid
    }
  }
}

接下来,在你的页面或组件中,使用高德地图的SDK并监听地图拖动事件:

export default {
  data() {
    return {
      map: null,
      addresses: []
    };
  },
  mounted() {
    this.initMap();
  },
  methods: {
    initMap() {
      const self = this;
      uni.createMapContext('myMap', this).then(mapContext => {
        self.map = mapContext;
        
        // 监听地图拖动事件
        mapContext.on('regionchange', function (res) {
          // 获取当前地图的中心点坐标
          self.map.getCenterLocation({
            success: function (centerRes) {
              // 使用中心点坐标获取地址列表(这里需要调用高德地图的逆地理编码API)
              const { latitude, longitude } = centerRes.result;
              // 调用你的API函数,例如 fetchAddresses(latitude, longitude)
              self.fetchAddresses(latitude, longitude);
            }
          });
        });
      });
    },
    fetchAddresses(latitude, longitude) {
      // 假设你有一个函数可以调用高德地图的逆地理编码API
      uni.request({
        url: `https://restapi.amap.com/v3/geocode/regeo?output=json&location=${latitude},${longitude}&key=your-amap-key`,
        success: (res) => {
          // 解析返回的地址信息
          const address = res.data.regeocode.formattedAddress;
          // 更新你的地址列表
          self.addresses.push(address);
        }
      });
    }
  }
};

请确保替换上述代码中的 your-app-idyour-amap-key 为你的实际值。此外,根据具体的报错信息,可能需要进一步调整代码,例如处理API调用的错误处理、权限申请等。如果问题仍然存在,建议查看高德地图SDK的官方文档或联系技术支持获取帮助。

回到顶部