乐趣区

关于腾讯地图:3分钟搞定微信小程序类美团用户商家距离计算

前言

小程序实操,间隔计算总结。

思路

一共有两种办法,各有利弊:

1. 利用小程序的 wx.getLocation 办法失去用户的经纬度, 而后用已知的商家的经纬进行计算;

2. 利用腾讯地图位置服务 calculateDistance 间接计算;

先相熟下两个单词:

longitude: 经度;

latitude: 纬度;

下边是两种办法的具体实现

一、获取用户的地位信息, 再进行计算 (wx.getLocation)

1. 小程序提供了获取用户地位信息的 api,所以咱们能间接获取到经纬度;

2. 在腾讯位置服务坐标拾取器,获取商家的具体经纬度 (例:北京故宫博物院 116.397027( 经度),39.917990(纬度));

3. 利用公式进行两点的经纬度计算,需注意:小程序默认坐标系是 wgs84,您需设置为 gcj02 再试;

代码:

Page({data:{},
 onLoad: function() {
        var _this = this;
        _this.findXy() // 查问用户与商家的间隔},
        
   findXy() { // 获取用户的经纬度
        var _this = this
        wx.getLocation({
            type: 'gcj02',
            success(res) {_this.getDistance(res.latitude, res.longitude, 39.917990,116.397027)
            }
        })
    },
    
     Rad: function(d) { // 依据经纬度判断间隔
        return d * Math.PI / 180.0;
    },
    getDistance: function(lat1, lng1, lat2, lng2) {
        // lat1 用户的纬度
        // lng1 用户的经度
        // lat2 商家的纬度
        // lng2 商家的经度
        var radLat1 = this.Rad(lat1);
        var radLat2 = this.Rad(lat2);
        var a = radLat1 - radLat2;
        var b = this.Rad(lng1) - this.Rad(lng2);
        var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
        s = s * 6378.137;
        s = Math.round(s * 10000) / 10000;
        s = s.toFixed(2) + '公里' // 保留两位小数
        console.log('经纬度计算的间隔:' + s)
        return s
    }
    )}

## 二、利用腾讯地图的位置服务

1、先到腾讯位置服务注册登录,申请 key、引入依赖。
下图的第三步配置是要在小程序的后盾那里设置,记得不要找错中央了。如图:

2、配置实现了之后,小程序从新编译一下

3、求两点间隔文档:腾讯地位 - 两点求距

4、读完可知, 咱们只须要商家的经纬度即可, 咱们在小程序里试验一下

// 引入 SDK 外围类
var QQMapWX = require('../../utils/qqmap-wx-jssdk.js');

Page({onLoad: function() {
        var _this = this;
        _this.findShop() // 查问用户与商家的间隔},
 findShop() { // 拿到商家的地理位置,用到了腾讯地图的 api
        // 实例化 API 外围类
        var _that = this
        var demo = new QQMapWX({key: '你申请到的 key' // 必填});
        // 调用接口
        demo.calculateDistance({
            to: [{

                latitude: 39.917990, // 商家的纬度
                longitude: 116.397027, // 商家的经度
            }],
            success: function(res) {let hw = res.result.elements[0].distance // 拿到间隔 (米)
                if (hw && hw !== -1) { // 拿到正确的值
                    // 转换成公里
                    hw = (hw / 2 / 500).toFixed(2) + '公里'
                } else {hw = "间隔太近或请刷新重试"}
          
                console.log('腾讯地图计算间隔商家' + hw);
            }
        });
    }
})

可能会呈现的谬误:
{status:199,message:’ 此 key 未开启 webservice 性能 ’}

此时须要关上腾讯位置服务 -key 配置, 设置一下方才申请 key 的详情页面,把下列选项全副勾上, 把你小程序的 appid 也写上,webservice 域名白名单设置为空即可。

保留完,从新编译再试

作者:大师兄

链接:https://segmentfault.com/a/11…

起源:SegmentFault

著作权归作者所有。商业转载请分割作者取得受权,非商业转载请注明出处。

退出移动版