百度地图聚合功能自定义聚合文字

研究百度地图聚合源码发现，如果打算自定义文字需要修改两处：

一、修改 BMapLib.MarkerClusterer.js 插件中 Cluster.prototype.updateClusterMarker 方法，实现过程如下：

方法中： this._clusterMarker.setText(this._markers.length) 表示， 聚合点显示的文字内容是 当前 Cluster 类 _markers 属性 的 长度

二、修改 TextIconOverlay.js 中的 构造方法 和 样式方法

查看 TextIconOverlay.js 的源码发现， text 只支持 数字类型的值，而且和 styles 属性绑定，需要修改constructor 方法， 和 设置属性的方法。

如上，知道了聚合的文字是 Cluster.prototype.updateClusterMarker 方法 ， 那么我们需要进行以下步骤：

通过查看百度地图聚合源码，发现 Cluster 类调用了 marker 的 getPosition 和 getMap 方法，我们需要自定义这俩方法如下：

最终，我们实现了自定义 百度地图点聚合文字 信息。

附Github： https://github.com/sphenginx/vue-slider

类 BMapLib.MarkerClusterer

通常需要在地图上标注出一些景点、建筑或者公共设施，可以选择使用矢量标注或者聚合标注。openlayers 添加矢量标注的原理是将标注添加到一个新建的矢量层上，再将矢量层添加到地图上叠加显示；聚合标注的原理同上，但它适用于标注的数据量非常大的场景，随着层级的放大，会展示更多的标注，缩小时，则将标注聚合显示，能够在大量加载标注时提高渲染性能。

1、矢量标注

2、聚合标注

openlayers 可以创建一个 Overlay 覆盖层，这个覆盖层能够展示自己写的 html 内容，从而实现添加各种所需的覆盖物。也可以通过这个方法来添加标注，但覆盖层添加的覆盖物会影响地图的拖动（即在覆盖物上进行滑动 *** 作时地图无法响应，虽然可以通过设置 stopEvent 将滑动事件传递到地图上，但这样会导致在IOS端的覆盖物无法进行点击 *** 作）。

因此如果要添加可以点击并且不影响地图拖动的标注时，建议使用矢量层标注，而如果要展示自定义的一些内容，如点击地图d出对话信息框、地图上的自定义按钮等则使用覆盖层更加合适。

1、加载覆盖层

2、添加地图点击监听事件

原理大致与添加矢量标注相同，都是添加在矢量图层上，不过这里添加的是线对象。

---