H5W3
当前位置:H5W3 > JavaScript > 小程序 > 正文

【小程序】小程序标记点(markers)怎么保持在地图中间?

组件:https://mp.weixin.qq.com/debu…
API:https://mp.weixin.qq.com/debu…

效果就像滴滴出行的地图,可以进行选点,让标记(markers)一直居中,用户滑动放手后,获取地图中心点坐标

回答

标记marker可以用control来做,将这个control定位在地图中间就行;
放手后获取地图中心坐标需要用regionchange,他可以判断当前对地图的操作状态,当e.type为end时用mapContext 获取到地图中心的位置;
相关文档:https://mp.weixin.qq.com/debu…
https://mp.weixin.qq.com/debu…

查看接口文档wx.createMapContext(myMap)
wxml:

<map id="myMap"></map>

js:

var mapCtx = wx.createMapContext(myMap)
var latitude,longitude;
mapCtx.getCenterLocation({
    success:function(res){
        latitude = res.latitude;
        longitude = res.longitude;
    }
}) //获取当前地图的中心经纬度
mapCtx.includePoints({
    padding:[10],
    points:[{
        latitude:latitude 
        longitude:longitude
    }]
})
mapCtx.translateMarker({
     markerId: 0,
     autoRotate: true,
     duration: 1000,
     destination: {
        latitude:latitude,
        longitude:longitude,
     },
     animationEnd() {
        console.log('animation end')
     }
})

楼主找到答案了吗?

本文地址:H5W3 » 【小程序】小程序标记点(markers)怎么保持在地图中间?

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址