首页 > 微信 > 详细

微信小程序定位

时间:2019-11-12 17:05:58      阅读:113      评论:0      收藏:0      [点我收藏+]

相关 API 使用,查看微信官方文档

(写在前面)流程:
wx.getSetting ---> wx.authorize ---> wx.getLocation ---> GetAddressByLonAndLat()

(1)定义参数

定义一个参数 isOpenLocationAuth ,方便区分 定位成功 与 定位失败 的各种情况,以便在界面上作出不同情况相应的展示

isOpenLocationAuth: 0     // 是否有定位权限 0定位中 1定位成功 2定位失败 3定位禁止


(2)判断是否有定位功能权限

当触发定位事件后,首先需要判断是否有定位功能权限,有则直接定位,没有则授权

onShow() {
    wx.showLoading({
        title: '定位中'
    })
    this.getLocationAuth();
},

getLocationAuth() {
    // wx.getSetting 获取设置
    wx.getSetting({
        success: res => {
        // 是否有定位权限
            if(!res.authSetting["scope.userLocation"]) {
                wx.hideLoading();
                // 没有权限则通过 wx.authorize 授权
                wx.authorize({
                    scope: 'scope.userLocation',
                    success: res => {
                          this.getLocation();
                    },
                    fail: () => {
                          wx.hideLoading();
                          this.setData({
                                isOpenLocationAuth: 2,   // 定位失败
                          })
                    }
                 })
             } else {
                this.getLocation();
            }
        }
    })
 },


(3)定位授权

没有定位权限时,需要定位授权,代码如(2)中所示,定位授权框,如下图所示

点击允许,则相当于初次开启定位权限,可以开始定位,点击不允许时,则关闭了定位权限,此时,界面上应该有按钮可再次触发去开启定位权限,“不允许”时,如下图所示

点击去授权,可以跳转至微信小程序官方权限设置界面

<text class="text_red">暂时无法获取当前位置</text>
<button open-type="openSetting" bindopensetting="toOpenSetting">去授权</button>

// button 触发位置授权
toOpenSetting(res) {
    if(res.detail && res.detail.authSetting['scope.userLocation']) {
          this.getLocation()
    }
},


(4)定位

有定位权限后,可以通过定位获取当前地址

getLocation() {
     wx.showLoading({
       title: '定位中',
    })
    //  wx.getLocation 定位
    wx.getLocation({
      type: 'gcj02',  // wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标
      success: res => {
        this.setData({
          chooseLatitude: res.latitude,
          chooseLongitude: res.longitude,
          isOpenLocationAuth: 1   // 定位成功
        })
        this.GetAddressByLonAndLat(res.longitude, res.latitude);  // 经纬度转地址
        wx.hideLoading();
      },
      fail: () => {
        wx.hideLoading();
        this.setData({
          isOpenLocationAuth: 3,
        })
      }
    })
 },

??注意:wx.getLocation 返回的是经纬度坐标,因此必须使用第三方服务进行逆地址解析时,在解析时,需要确认第三方服务默认的坐标系,以便正确进行坐标转换

微信小程序定位

原文:https://www.cnblogs.com/Pecci/p/11842753.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!