wx.chooseLocation地图的使用

落雪小轩韩

已于 2023-05-25 09:33:48 修改

阅读量4.5k

点赞数 2

分类专栏：微信小程序文章标签：微信小程序

于 2022-10-20 17:45:13 首次发布

本文链接：https://blog.csdn.net/m0_46613429/article/details/127431501

版权

微信小程序专栏收录该内容

41 篇文章 5 订阅

订阅专栏

一、申请开通

在小程序管理后台，「开发」-「开发管理」-「接口设置」中开通该接口权限，否则可能审核不通过

二、用法

1、配置地理位置用途说明

app.json中：

"permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示" 
    }
 }

2.声明需配置的接口

在这里插入图片描述如果小程序中用到了上述接口，都需要在app.json中进行配置，否则上线成功后也用不了这个功能
app.json中：

"requiredPrivateInfos": ["getLocation", "chooseLocation", "chooseAddress"]

3.获取当前位置

    wx.getLocation({
      // wgs84 返回 gps 坐标，gcj02 返回可用于wx.openLocation的坐标
      type: 'gcj02',
      //获取位置成功
      success: function (res) {
        console.log(res)  //获取的的当前位置的详细信息，包含需要的坐标
      },
      //获取位置失败
      fail: function (err) {
        console.log("获取位置信息失败，请返回重试")
      },
      //接口调用结束的回调函数（调用成功、失败都会执行）
      complete: function (info) {
        console.log("完成")
      },
    })

4.根据坐标位置显示地图导航

wx.openLocation({
 	//当前经纬度
  latitude: 31.232091,
  longitude: 121.493491,
  //缩放级别默认18,缩放比例为5-18
  scale: 18,
  //位置名
  name: '外滩',
  //详细地址
  address: '上海市上海市黄浦区延安东路与中山东二路交叉口东南',
  //成功打印信息
  success: function (res) {
  },
  //失败打印信息
  fail: function (err) {
    wx.showToast({
      title: '调用地图失败，请返回重试',
    })
  },
})

5.选择位置

wx.chooseLocation({
   success: function (res) {
      console.log(res); 
    },
    fail: function () {
    },
    complete: function () {
    }
})

6.计算两地的距离

// la1, lo1, la2, lo2分别代表（第一个坐标点的纬度、第一个坐标点的经度、第二个坐标点的纬度、第二个坐标点的经度）
const calculateDistance = (la1, lo1, la2, lo2) => {
  var La1 = la1 * Math.PI / 180.0;
  var La2 = la2 * Math.PI / 180.0;
  var La3 = La1 - La2;
  var Lb3 = lo1 * Math.PI / 180.0 - lo2 * Math.PI / 180.0;
  var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(La3 / 2), 2) + Math.cos(La1) * Math.cos(La2) * Math.pow(Math.sin(Lb3 / 2), 2)));
  s = s * 6378.137;
  s = Math.round(s * 10000) / 10000;
  s = s.toFixed(2);
  return s;
}