微信小程序-逆地址解析-Toy模板网

这篇具有很好参考价值的文章主要介绍了微信小程序-逆地址解析。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

根据经纬度查询周围小区用到的是逆地址解析的功能，所谓的逆地址解析是指根据经纬度获取位置的相关描述，在申请完密钥后下载微信小程序 Javascript SDK 调用其提供的方法即可实现查询周围小区的功能。

逆地址解析,微信

第三步：下载并解压后将 Javascript SDK 放到 libs 目录下，然后到 utils/qqmap.js 中配置腾讯位置服务的密钥。

逆地址解析,微信

然后在调用 SDK 提供的 reverseGeocoder 方法获取位置描述：

逆地址解析,微信

具体代码如下：

// house_pkg/pages/locate/index.ts
// 导入腾讯位置服务提供的 Javascript SDK
import qqmapsdk from '../../../utils/qqmap'
Page({
  /**
   * 页面的初始数据
   */
  data: {
    address: '',
    points: []
  },

  onLoad(){
    // 页面一加载就获取用户所在周围小区
    console.log(6666);
    this.getLocation()
  },

  //获取 用户所在位置经纬度  主动获取
  async getLocation() {
    console.log(1111111);
    //获取 用户所在位置经纬度
    const {
      latitude,
      longitude
    } = await wx.getLocation()
    // 查看经纬度
    console.log(latitude, longitude, 55)
    // 调用 SDK 提共的方法 根据经纬度获取位置信息
    this.getPoint(latitude, longitude)
  },
  // 用户点击【重新定位】按钮时调用 wx.chooseLocation 获取用户指定位置的经纬度
  async chooseLocation() {
    // 用户所在位置经纬度
    const {
      latitude,
      longitude
    } = await wx.chooseLocation()
    // 查看经纬度
    console.log(latitude, longitude, 56)
    // 调用函数 根据经纬度获取位置信息
    this.getPoint(latitude, longitude)
  },

  getPoint(latitude, longitude) {
    console.log(latitude, longitude, 888888);
    // 逆地址解析（根据经纬度查询位置相关描述）
    qqmapsdk.reverseGeocoder({
      // location: [latitude, longitude].join(','), //获取表单传入的位置坐标
      location: '30.707141,114.400824', //获取表单传入的位置坐标  固定坐标
      success: (res) => {
        console.log(res, 7777);
        // 结果为当前所在的地址
        this.setData({
          address: res.result.address
        })
      },
    })
    // 搜索
    qqmapsdk.search({
      keyword: '住宅小区', //搜索关键词
      // location: [latitude, longitude].join(','), //设置周边搜索中心点
      location: '30.707141,114.400824',   //设置周边搜索中心点  固定坐标
      success: (res) => { //搜索成功后的回调
        console.log(res, 2222);
        let points = res.data.map(item => {
          return {
            id: item.id,
            title: item.title,
            _distance: item._distance
          }
        })
        console.log(points, 3333);
        // 更新数据，重新渲染
        this.setData({
          points
        })
      },
      fail: function (res) {
        console.log(res);
      },
      complete: function (res) {
        console.log(res);
      }
    })
  },
  // 选择楼栋
  goBuilding(ev) {
    console.log(ev, 88);
    wx.navigateTo({
      url: '/house_pkg/pages/building/index?point=' + ev.mark.point,
    })
  },

文章来源地址https://www.toymoban.com/news/detail-604397.html

到了这里，关于微信小程序-逆地址解析的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！