微信小程序地图计算两个点之间的距离
最近在做微信小程序,需要用到计算两个标注点之间的距离,简单代码示例如下:
<template>
<view class="content">
<map id="maps" style="width: 100%; height: 700rpx;"
:latitude="latitude"
:longitude="longitude"
:markers="markers"
:circles="circles"
@tap="handleClickMap">
</map>
</view>
</template>
<script>
export default {
data() {
return {
current: 0,
latitude: 25.081037,
longitude: 102.73249,
markers: [{
latitude: 25.081037,//纬度
longitude: 102.73249,//经度
}],
circles:[{ //在地图上显示圆 ,
latitude: 25.081037,
longitude: 102.73249,
fillColor: "#9db0de6A", //填充颜色
color: "#00aaff", //描边的颜色
radius: 100, //半径
strokeWidth: 1 //描边的宽度
}]
}
},
mounted(){
let olds = {
latitude: 25.081037,
longitude: 102.73249
};
let news = {
latitude:25.080271,
longitude:102.731915,
};
let num = 0;
num = this.getDistance(olds.latitude,olds.longitude,news.latitude,news.longitude);
console.log('距离:'+num);
this.getLocation();
},
methods:{
// 获取位置
getLocation(){
let that = this;
uni.getLocation({
type:'wgs84',
success: (res) => {
const latitude = res.latitude; // 经度
const longitude = res.longitude; // 纬度
console.log(latitude,longitude);
},
fail:(res) => {
uni.showToast({
icon:'none',
title:'地址信息获取失败请打开GPRS权限'
});
}
});
},
// 点击标注
handleClickMap(e){
let that = this;
let id = e.currentTarget.id;
let maps = uni.createMapContext('maps', this).$getAppMap();
maps.onclick = function(point) {
console.log(point);
// point.iconPath = '/static/btn_loc0.png';
that.markers = that.markers.concat(point);
uni.showToast({
title: '添加成功',
icon: 'none'
});
};
},
getDistance(latFrom, lngFrom, latTo, lngTo) {
var EARTH_RADIUS = 6378136.49;
function rad(d) {
return d * Math.PI / 180.0;
}
var radLatFrom = rad(latFrom);
var radLatTo = rad(latTo);
var a = radLatFrom - radLatTo;
var b = rad(lngFrom) - rad(lngTo);
var distance = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLatFrom) * Math.cos(radLatTo) * Math.pow(Math.sin(b / 2), 2)));
distance = distance * EARTH_RADIUS;
distance = Math.round(distance * 10000) / 10000;
return parseFloat(distance.toFixed(0));
}
}
}
</script>
<style>
</style>

浙公网安备 33010602011771号