需要的开源库
1.MarkerClusterer.js :计算聚合点的生成
2.TextIconOverlay.js : 聚合点的图标
需求:
1. 点击聚合点 判断是不是最大层级;如果不是最大层级,继续点击,如果是最大层级则不能点击,鼠标覆盖聚合类的图标。图标发生改变,同事弹出框,鼠标可以点击框里面的每一项的数据;
实现方法:
1,判断是不是最大层级 需要在实例化聚合类的时候 增加参数maxZoom:20;因为百度地图最大是19层级;
new BMapLib.MarkerClusterer(map, {
markers: markers,
maxZoom: options.maxZoom || 20,
margins: options.margins || [90, 500, 80, 400]
});
判断最大层级的方法 :map.getZoom();可以返回当前地图的最大层级;
2.鼠标覆盖图标改变;
需要修改 TextIconOverlay.js源码;源码可以很容易理解。
TextIconOverlay 里面有鼠标覆盖和移出的事件。具体代码鉴于公司保密不贴出来。初始化的时候也可以改,如果你是使用的是框架的话 需要把静态图标放到public文件不参与编译,不然文件名字发生变化。
3.弹框的实现是采用的label;通过marker点来获取所有聚合点下的数据;