原生小程序配合腾讯地图选择地理位置

直接代码(亲测没问题)

1.wxml文件

<button bindtap="getCenterLocation">点击获取位置</button>

2.js文件

// 打开地图地址选择
  getCenterLocation() {
    var that = this;
    // 微信授权
    wx.authorize({
      // 地理位置
      scope: 'scope.userLocation',
      complete: function (res) {
        console.log(res)
        wx.chooseLocation({
          success(str) {
            console.log(str)
            // 调用腾讯地图接口
            that.getLocation(str)
          }
        })
      }
    })
  },
  // 调用腾讯地图接口
  getLocation(val) {
    var that = this;
    return new Promise((res, rej) => {
      //腾讯地图key值
      var key = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
      //发送请求通过经纬度反查地址信息
      var getAddressUrl = "https://apis.map.qq.com/ws/geocoder/v1/?location=" + val.latitude + "," + val.longitude + "&key=" + key + "&get_poi=1";
      wx.request({
        url: getAddressUrl,
        success: function (result) {
          console.log(result)
          var province = result.data.result.address_component.province;
          var city = result.data.result.address_component.city;
          var district = result.data.result.address_component.district;
          var address = result.data.result.formatted_addresses.recommend;
          console.log('省市县:' + province + city + district)
          console.log('地址:' + address)
        },
        fail: Error => {
          rej(Error)
        },
      })
    })
  },

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值