地图中控件绑定事件

控件绑定对应的事件函数。
在index.wxml中添加一个bindcontroltap属性,赋值一个函数名
bindcontroltap='controltaps'
在index.js中定义一个controltap函数

//控件被点击事件
  controltaps: function (e) {
    console.log(e)
  },

可以看出哪一个控件被点击了。


image.png

可以根据前面设置的controlId来对相应的控件执行相对应的操作。

onReady函数

在onload函数执行结束后,即页面渲染结束后就会执行这个函数。
可以将页面渲染结束后的地图位置信息保存在这个函数里
查看微信小程序文档API,
创建并返回 map 上下文 mapContext 对象。在自定义组件下,第二个参数传入组件实例this,以操作组件内 <map/> 组件
wx.createMapContext(mapId, this)

image.png

onReady:function(res){
    this.mapCtx=wx.createMapContext("mymap")
  }

注意:"mymap"是指map标签的id,所以需要给map添加一个id属性
id='mymap'

回到原来位置
控件的id为4,所以cid==4时调用moveToLocation返回当前位置

 //控件被点击事件
  controltaps: function (e) {
    var cid = e.controlId;
    if(cid==4){
      this.mapCtx.moveToLocation();
    }
    console.log(cid);
  },

注意:这里需要设置map的属性show-location='true';
此时就可以拖动地图,然后点击控件4就可以返回到原来的位置。这时候可以在原来的位置加一个控件,表示这是原来的位置

 {
             id: 5,
             iconPath: '/img/location.png',
             position: {
               width: 30,
               height: 30,
               left: windowWidth / 2 - 15,
               top: windowHeight /2 - 26
             }
           }

此时可以随便的拖动地图,然后点击地图回到原来的位置。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明AGI阅读 16,019评论 3 119
  • 给你发了张图片 上面有特别关心亲密度 上面有你,99% 突然间好难过啊 你说what are you talkin...
    非衣宝贝阅读 243评论 0 0
  • 对于秋风 我总是这样灵敏 战场,在耳朵那狭长的隧道里摆开 才出生的小兔子 你的毛发还是那样稀疏 我又托谁向秋风说个...
    冷冬年阅读 5,214评论 156 197
  • 1.如何描述语音 2.如何理解语音的构成 3.语音如何识别 语音的基本概念 语音是一个复杂的现象。我们基本上不知道...
    Major术业阅读 4,126评论 0 8
  • 先生说,博学、审问、慎思、明辨、笃行实是一回事,可以理解为是治学的几个不同的角度: 从探求能其事的角度就是博学,解...
    镶润_读书阅读 308评论 0 3