写给初入微信小程序的自己-添加一个地图导航图

wxml代码:

<view class='ditu'>
   <view>
  <map id="map" longitude="112.682800" latitude="37.7299564" markers="{{markers}}"  
  scale="18"  style="width: 100%; height: 300px;" bindtap="click">  
  </map>  
  </view>
</view>

分析:

longitude="112.682800" 设置中心纬度

latitude="37.7299564" 设置中心经度

style="width: 100%; height: 300px;"

显示图片的的大小

宽度 :100%;

高度:300px;

bindtap="click"  :添加一个点击事件

js 代码:

 
data: {
    markers: [{
      iconPath: "", //浮标样式
      id: 0,
      latitude: 37.7299564, //浮标位置
      longitude: 112.682800,
      width: 35,  //浮标大小
      height: 45
    }],
  },

<!-- 点击事件js代码  -->
click: function (e) {
    wx.openLocation({
      latitude: 37.7299564, //目的地位置
      longitude: 112.682800,
      scale: 18,
      name: '位置名字', //自定义
      address: '位置名字后的备注' //自定义
    })
  },

点击后会跳转到外部地图。

目的地为写的坐标。

 

展开阅读全文

没有更多推荐了,返回首页