我们都知道天地图的有聚合点功能,不过由于官方封装的API中并没有关于聚合点位的后续功能性的API,因此在实际使用场景中可能并不是很适用,本文主要介绍如何取消天地图原本的聚合点的点击事件,并且在点击后获取该聚合点标记下所聚合的marker点位对象。
首先,通过打印出聚合点的对象,可以发现里面有绑定一个 clusterclick 属性,此属性即是聚合点的默认点击方法,在这里我们需要将其禁用,用以绑定我们自己的方法实体。不过由于其父对象为编译属性,可能在将来天地图版本更新中有改变,因此我们查找这个属性方法时不能直接使用 qQ.clusterclick 的方式,切记!可以使用便利方法查找该点击事件实体,示例如下:
不要以为解绑后再绑定新的方法后,就能通过 e.target.options.markers 得到点击时聚合点下对应的标记点了,如下图,你以为点击 聚合为 27 的标记后这里的 markers 就是27吗?并不是的,这里是生成聚合点时的所有标记点的数组,所以是没有办法从这里拿到你想要的聚合点下的标记的
不过也不用灰心,我们发现在天地图的文档里面有介绍关于聚合点的聚合规则,是通过页面上标记点的像素间距来判断是否聚合的,默认状态下,标记的聚合像素距离为60px, 因此我们这里使用的方法便是遍历所有的聚合点位,然后用来与当前点击的聚合点的像素距离,小于等于60时,便说明该点处于本次点击的聚合点下面,否则不属于本聚合点。因为 从点击事件中我们能直接拿到点击的聚合点的像素位置坐标(e.layerPoint),天地图本身又提供了经纬度转像素坐标的方法(lngLatToLayerPoint()),自此,便达到了我们获取点击的聚合点下对应的标记点的目的。