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

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

一、修改 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

arker可以添加附件，new MarkerOptions().extraInfo()每个marker附件信息可以不一样

给marker添加点击事件监听，点击时根据附件信息的不同跳转到不同activity即可

var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {

offset: new BMap.Size(10, 25),

imageOffset: new BMap.Size(0, 0 - index * 25)

})

var marker = new BMap.Marker(point, {icon: myIcon})

map.addOverlay(marker)

这是引用百度自己的标注，看明白了没有，这个小标注的字不是加上去的，而本身就是一张图，连在一块的。想自定样式的话可以自己制作并切图，这样考验你的CSS了 ，总之很烦的 。个人觉得直接引用百度的就可以了。

---