【微信小程序遇到的坑】获取当前位置

关于获取用户当前位置,微信官方文档使用wx.getLocation()来让用户授权位置信息

wx.getLocation({
  type: 'wgs84',//默认为 wgs84 返回 gps 坐标,gcj02 返回可用于wx.openLocation的坐标
  success: function(res) {
    var latitude = res.latitude
    var longitude = res.longitude
    console.log(res)
  }
})

得到输出的结果

【微信小程序遇到的坑】获取当前位置_第1张图片

这时候需要将地理坐标信息转化为具体中文位置

腾讯官方给出了针对小程序地图位置信息的JavaScript SDK

http://lbs.qq.com/qqmap_wx_jssdk/index.html

第一步,申请密钥

【微信小程序遇到的坑】获取当前位置_第2张图片

 

第二步,通过 逆地址解析 ,就可以实现地理位置的中文转换。

【微信小程序遇到的坑】获取当前位置_第3张图片

最终输出结果

【微信小程序遇到的坑】获取当前位置_第4张图片

 

js代码

// 引入SDK核心类
var QQMapWX = require('../../tools/qqmap-wx-jssdk.min.js');
// 实例化API核心类
var demo = new QQMapWX({
  key: '开发者密钥' // 必填
});
Page({
  data: {
    localCity: ""//本地城市
  }
  /**
 * 生命周期函数--监听页面加载
 */
  onLoad: function (options) {
    let that = this;
    // 调用接口
    wx.getLocation({
      type: 'wgs84',
      success: function (res) {
        var latitude = res.latitude//纬度
        var longitude = res.longitude//经度
        demo.reverseGeocoder({
          location: {
            latitude: latitude,
            longitude: longitude
          },
          success: function (res) {
            console.log(res);
            let province = res.result.address_component.province;//省份
            let city = res.result.address_component.city;//城市
            that.setData({
              localCity: city
            })
          },
          fail: function (res) {
            console.log(res);
          }
        });
      }
    })
  }
})

 

你可能感兴趣的:(微信小程序)