微信小程序map地址间距离计算以及导航功能实现
在微信小程序当中,实现简易的、没有很多复杂功能的地图,可以选用小程序的原生map组件。
WXML如下:
常用属性如下:(来自微信公众平台-小程序开发文档)
| 属性 | 类型 | 默认值 | 说明 |
| longitude | Number | 中心经度 | |
| latitude | Number | 中心纬度 | |
| scale | Number | 16 | 缩放级别,取值范围为5-18 |
| markers | Array | 标记点 | |
| subkey | String | '' | 个性化地图使用的key,仅初始化地图时有效 |
| bindmarkertap | EventHandle | 点击标记点时触发,会返回marker的id |
1、导航功能实现
需求:从当前位置导航至标记点所在的位置,当点击标记点时触发导航功能
markertap: function (e) {wx.openLocation({latitude: 39.915378,longitude: 116.403694,scale: 18,name: '天安门广场',address:'北京市东城区长安街'})
},
2、两点间距离的计算(默认单位km)
//进行经纬度转换为距离的计算function Rad(d){return d * Math.PI / 180.0;//经纬度转换成三角函数中度分表形式。}//计算距离,参数分别为第一点的纬度,经度;第二点的纬度,经度function GetDistance(lat1,lng1,lat2,lng2){var radLat1 = Rad(lat1);var radLat2 = Rad(lat2);var a = radLat1 - radLat2;var b = Rad(lng1) - 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 ;// EARTH_RADIUS;s = Math.round(s * 10000) / 10000; //输出为公里//s=s.toFixed(2);return s;}
PS:上面的公式是通过弧度公式算出来的球体上两点之间的最短距离,和导航上的步行/骑行等距离有差别。
参考:https://blog.csdn.net/zzjiadw/article/details/7031610
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
