小程序获取用户位置与高德地图SDK经纬度逆地址解析

最近接手写小程序项目,遇到了获取用户经纬逆解析地址的问题,记录如下:

  • 微信小程序获取用户位置信息
wx.getLocation({
       type: "wgs84", //wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标  gcj02在android机上有bug,无法选择位置
       success(res) {
           console.log(res)
       }
});
  • 逆地址解析(获取到用户所在位置经纬度,对应转换为用户所在省市区)
    步骤:
  1. 申请到高德key;点击申请
  2. 将https://restapi.amap.com添加到微信小程序合法域名里面
  3. 下载高德微信小程序sdk 点击下载
    附:高德微信小程序sdk文档说明 点击查看
  4. 将SDK的js文件引入
import amapFile from "../../../../../static/sdk/amap-wx";
  • 下面贴代码图
data() {
    return {}
},
created() {},
mthods: {
    var that = this;
    var myAmapFun = new amapFile.AMapWX({key:'填入你申请的高德Key'});
    wx.getLocation({
        type: 'wgs84',
        success (res) {
            myAmapFun.getRegeo({
                location: `${res.longitude},${res.latitude}`,
                success(data) {
                    let str = {
                        province: '',
                        city: ''
                    }
                    // 拿到省份
                    str.province = data[0].regeocodeData.addressComponent.province;
                    // 拿到城市
                     str.city = data[0].regeocodeData.addressComponent.city;
                     if(Object.prototype.toString.call(str.city)=="[object Array]"){
                         str.city = str.city.join('');
                      }
                      wx.setStorageSync('city',str)
            },fail(err) {
                    console.log('333333333333333',err)
                }
    })
}
  • 返回参数说明 点击查看

到这里了,如果对你有帮助,帮忙点个赞呗~~

你可能感兴趣的:(小程序获取用户位置与高德地图SDK经纬度逆地址解析)