高德地图marker点多类点切换问题

背景介绍:

      地图上有两类点(采样点与合作社点)点击按钮切换展示不同的点如下图展示内容

之前我写的切换是给两类不同的点绑定上不同的 class名称 给他们做显示隐藏(比较lou的方法大家不要学习)这样做的后果会导致一个问题就是地图上的自己定义的内容是隐藏起来了看不到了 但是点击地图 还是存在这个marker点的 再加上macker有点击事件绑定更加明显

所以认真的看了官网找到了解决办法

在我们渲染marker点是增加extData属性 给一个任意的值 

 marker = new AMap.Marker({
      map: map,
      position: [+lngs[0], +lngs[1]], //基点位置
      topWhenMouseOver: true,//鼠标移进时marker是否置顶,默认false,不置顶(自v1.3 新增)
      draggable: false,  //是否可拖动
      extData: "hzsMark",
      content: "<ul class='markerIcon makerT makerY'><li>" + data.name + "</li></ul>",
});

然后 获取所有的marker点 并在这些点中寻找extData属性值为hzsMark的marker点 然后进行删除

 clearMarker('marker','hzsMark') 
function clearMarker(typename,extData) {
            var lays = map.getAllOverlays(typename); //获取田地地图中所有地块 数组
            if (lays.length > 0) {
                for (var i = 0; i < lays.length; i++) { //遍历数组
                    var exid = lays[i].getExtData();
                    if (exid == extData) {//寻找相同名称的
                        map.remove(lays[i]);
                    }
                }
            }
        }

然后在切换时 就可以删除当前页面不需要展示的marker点 然后再渲染需要展示的点

大佬们有更好的方法可以告诉我呀一起学习

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值