• Welcome to Journal web site.

我是 PHP 程序员

- 开发无止境 -

Next
Prev

(8条消息) 微信小程序map地址间距离计算以及导航功能实现_xiaomajia029的博客

Data: 2013-06-28 06:31:50Form: JournalClick: 7

微信小程序map地址间距离计算以及导航功能实现

在微信小程序当中,实现简易的、没有很多复杂功能的地图,可以选用小程序的原生map组件。

WXML如下:

  1. <map id="mymap" longitude="{{longitude}}" latitude="{{latitude}}" scale="14" markers="{{markers}}" subkey="IULBZ-XXXX-XXXX-XXXX-XXXX" bindmarkertap="markertap" show-location>
  2. </map>

常用属性如下:(来自微信公众平台-小程序开发文档)

属性类型默认值说明
longitudeNumber 中心经度
latitudeNumber 中心纬度
scaleNumber16缩放级别,取值范围为5-18
markersArray 标记点
subkeyString''个性化地图使用的key,仅初始化地图时有效
bindmarkertapEventHandle 点击标记点时触发,会返回marker的id

1、导航功能实现

需求:从当前位置导航至标记点所在的位置,当点击标记点时触发导航功能

  1. markertap: function (e) {
  2. wx.openLocation({
  3. latitude: 39.915378,
  4. longitude: 116.403694,
  5. scale: 18,
  6. name: '天安门广场',
  7. address:'北京市东城区长安街'
  8. })
  9. },

2、两点间距离的计算(默认单位km)

  1. //进行经纬度转换为距离的计算
  2. function Rad(d){
  3. return d * Math.PI / 180.0;//经纬度转换成三角函数中度分表形式。
  4. }
Name:
<提交>