微信小程序实现定位功能

分享两个微信小程序获取定位的办法,用的腾讯的地图，可根据自己的情况改动

前情提示：提前在您的app.json上加上这些代码

"permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于地图中定位"
    }
  }

这样才可以继续实现定位功能

第一种：wx.getLocation

附上代码

 GPSbtn() {
    let _this = this
    wx.getLocation({
      type: 'gcj02',
      altitude: true,
      isHighAccuracy: true,
      success: res => {
        console.log(res);
        const latitude = res.latitude //纬度
        const longitude = res.longitude //经度
        // 调用获取城市名称方法
        _this.getCity(latitude, longitude)
      }
    })
  },
  // 获取定位城市名称方法
  getCity: function (latitude, longitude) {
    wx.request({
      url: `https://apis.map.qq.com/ws/geocoder/v1/?key=腾讯地图申请的key&location=` + latitude + ',' + longitude,
      success: res => {
        console.log(res) // 此处返回的就是城市名称
        console.log(res.data.result.address);// 具体地址
      }
    })
  },

这是打印的值，大家可以参考一下

这个能返回一个稍微有点偏差的，我的偏差大概是在4公里这样，但是真机调试的时候没那么大。我也查阅了大量资料发现现在确实是有这个问题而且没有太好的解决办法，大家可以跟领导说一下这个问题，作为一个前端这些问题一定要及时反馈

第二种：wx.chooseLocation

附上代码

 // 定位
  GPSbtn() {
    wx.chooseLocation({
      type: 'wgs84',
      success: res => {
        console.log(res);
      }
    })
  },

大家可以看到这个定位代码很少，因为这个是微信之前推出可自选地址的一个定位，点击效果是这样的:

可以看到用户可以自己去选择地址，如果应用场景是打卡什么的就不建议用这种了，下面是控制台打印的内容

可以看到这个自选的地址还是很精准的，大家可以根据情况来选择适合自己的定位

最后附上微信官方文档的定位文章:位置 / wx.getLocation (qq.com)