前言

小程序實操，距離計算總結。

思路

一共有兩種方法，各有利弊：

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域名白名單設置為空即可。

保存完，重新編譯再試

作者：大師兄

來源：SegmentFault

著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。

總結

以上是生活随笔為你收集整理的微信外卖小程序 怎么计算与客户的距离_微信小程序结合腾讯位置服务实现用户商家距离计算...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。