E企盈小程序营销工具技术服务商 热线:4006-838-530

小程序定位,接入腾讯位置服务

E企盈小程序直播系统

接入腾讯位置服务官方文档:https://lbs.qq.com/qqmap_wx_jssdk/index.html一.接入腾讯位置服务步骤公众号扫码注册,选择你要授权的小程序,到授权成功然后腾讯位置服务页面会变成注册新账号注册成功申请key配置key填写WebServiceAPI的授权白名单或授权IP在微信小程序中设置域名开发 –  开发设置 – request合法域名添加 https://apis.map.qq.com二、在小程序中初始化腾讯位置服务下载微信小程序JavaScriptSDK,并将js放在新建的lib文件夹下载js中引入var QQMapWX = require(‘../../libs/qqmap-wx-jssdk.js’);var qqmapsdk;Page({    onLoad: function () {        // 实例化API核心类        qqmapsdk = new QQMapWX({            key: ‘申请的key’        });    }})三、在小程序中定位微信小程序-获取当前城市位置1, 获取当前地理位置,首先要拿到用户的授权wx.openSetting;2,微信的getLocation接口,获取当前用户的地理位置(微信返回的是经纬度,速度等参数);3,腾讯位置服务的qqmapsdk.reverseGeocoder腾讯地图逆地址解析方法,根据坐标获取当前位置名称;小程序有个wx.getLocation方法可以实现定位获取经纬度,但是首先需要让用户给一下权限// miniprogram/pages/index.jsvar QQMapWX = require(‘../../../libs/qqmap-wx-jssdk.js’);var qqmapsdk;Page({  data: {    cost: ‘–‘,    scale: 18,    longitude: ”,    latitude: ”,    markers: []  },  submit_order(){    wx.navigateTo({      url: ‘/pages/user/waitrec/waitrec’    })  },  /**   * 生命周期函数–监听页面加载   */  onLoad: function (options) {    wx.getSetting({      success: (res) = {        // res.authSetting[‘scope.userLocation’] == undefined    表示 初始化进入该页面        // res.authSetting[‘scope.userLocation’] == false    表示 非初始化进入该页面,且未授权        // res.authSetting[‘scope.userLocation’] == true    表示 地理位置授权        if (res.authSetting[‘scope.userLocation’] != undefined && res.authSetting[‘scope.userLocation’] != true) {          wx.showModal({            title: ‘请求授权当前位置’,            content: ‘需要获取您的地理位置,请确认授权’,            success: function (res) {              if (res.cancel) {                wx.showToast({                  title: ‘拒绝授权’,                  icon: ‘none’,                  duration: 1000                })              } else if (res.confirm) {                wx.openSetting({                  success: function (dataAu) {                    if (dataAu.authSetting[“scope.userLocation”] == true) {                      wx.showToast({                        title: ‘授权成功’,                        icon: ‘success’,                        duration: 1000                      })                      //再次授权,调用wx.getLocation的API                      this.getAddress();                    } else {                      wx.showToast({                        title: ‘授权失败’,                        icon: ‘none’,                        duration: 1000                      })                    }                  }                })              }            }          })        } else {          //调用wx.getLocation的API          this.getAddress();        }      }    });    //判断全局变量寄件信息和收件信息,都存在则显示费用    var app = getApp();    if (app.globalData.send_info.address && app.globalData.receive_info.address) {      this.setData({        cost: 100      })    }  },  //获取定位信息  getAddress(){    // 实例化腾讯地图API核心类    qqmapsdk = new QQMapWX({      key: ‘LXKBZ-IQY6X-XAM4F-ZTULL-OMKDQ-IBB3U’    });    var that = this;    //获取当前位置    wx.getLocation({      type: ‘wgs84’,      success: function (res) {        var lat = res.latitude;        var lon = res.longitude;        //根据坐标获取当前位置名称,腾讯地图逆地址解析        qqmapsdk.reverseGeocoder({          location: { latitude: lat, longitude: lon },          success: function (res) {            var address = res.result.address;            that.setData({              latitude: lat,              longitude: lon,              markers: [{                id: ‘1’,                iconPath: “../../../images/icon_cur_position.png”,                width: 22,                height: 32,                latitude: lat,                longitude: lon,                callout: {                  content: address,                  color: “#393939”,                  textAlign: ‘center’,                  fontSize: 13,                  borderRadius: 20,                  bgColor: “#ffffff”,                  padding: 10,                  display: “ALWAYS”                },              }]            })          }        });      }    });  }})相关官方网址wx.getLocation授权

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 小程序定位,接入腾讯位置服务
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏