本文以西安酷聯之前某房產微信小程序為案例。當用戶進入某一樓盤詳情頁時,有這樣一個需求:如果后臺錄入了樓盤的經緯度坐標,則需要展示用戶當前所處位置和樓盤(售樓部)大概的距離。
所需代碼如下:
js部分:
data: {
distance: 0
}
onLoad: function () {
var that = this;
wx.getLocation({
type: 'wgs84',
success: function (res) {
//console.log(res);
var latitude = res.latitude;
var longitude = res.longitude;
var distanceStr = util.getDistance(latitude, longitude, that.data.project.dituweidu, that.data.project.ditujingdu);
that.setData({
distance: Number(distanceStr).toFixed(2)
});
}
});
}
util中計算距離的方法:
getDistance:function(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;
return s;
}
wxml部分:距離您大約{{distance}}公里
以上就是小編為大家整理的內容,最終的效果展示如下: