标记聚合管理

标记聚合管理是以搜狗地图 API为基础开发的组件,主要用于在搜狗地图上还有多个距离相近的Marker时,使之聚合在一起,便于管理。

引用类库

由于组件是基于搜狗地图 API开发,使用前要先引用搜狗地图 API,再引用组件文件,本组件除需要 markerManager.js外,还依赖 markerCluster.js和 textIcon.js。如下:

<script src="//api.go2map.com/maps/js/api_v2.5.1.js" type="text/javascript"></script>
<script src="//api.go2map.com/maps/js/component/textIcon.js" type="text/javascript"></script>
<script src="//api.go2map.com/maps/js/component/markerCluster.js" type="text/javascript"></script>
<script src="//api.go2map.com/maps/js/component/markerManager.js" type="text/javascript"></script>

其中组件文件为源文件,保留了编写时的格式以及注释,用户可根据自己需要下载,修改。

如有意见,可登录社区进行交流。

应用示例

在页面应用组件,将Marker添加在管理聚合实例中,具体应用可查看示例页面源文件。

应用示例页面:点我

MarkerManager类

构造方法

构造函数 说明
MarkerManager(opt:MOptions) 在地图上创建一个示例,根据参数管理Marker。

方法

方法 返回值 说明
addMarkers(markers:Array[Marker]) None 添加新的Marker。
delMarker(marker:Marker) None 删除一个Marker。
delMarkers(markers:Array[Marker]) None 删除一组的Marker。
getMarkers() Array[Marker] 获取所有Marker。
getClusters() Array[MarkerCluster] 获取所有Marker 族。
setMaxZoom(num:Number) None 设置最大聚合级别,刷新图标。
setMinNum(num:Number) None 设置最小聚合单位,刷新图标。
setGridSize(num:Number) None 设置每个聚合格子大小。
setStyles(styles:Array[Istyle) None 设置图标样式,刷新图标。
remove() None 清除地图上聚合类,可被 Map.clearAll触发。

事件

事件名称 参数 说明
culclick Array[Marker] 聚合图标被点击时触发此事件,参数为此聚合所包含Marker 集合。

MOptions对象

属性 类型 说明
map Map 必填项。表示本实例所依赖地图。
markers Array[Marker] 必填项。设置本实例所管理Marker。
averageCenter Boolean 可选项。聚合时是否以各marker中心点为聚合点,false则以第一个marker为中心,默认 false。
minNum Number 可选项。最小聚合数目,默认为2。
maxZoom Number 可选项。聚合时地图最大级别,超过此级别则不聚合。
gridSize Number 可选项。格子大小,像素单位,默认60。
styles Array[Istyle] 可选项。图标样式系列,可随text变化而变化。

MarkerCluster类

构造方法

构造函数 说明
MarkerCluster(opt:MarkerManaer) 一个Marker聚合族。

方法

方法 返回值 说明
addMarker(marker:Marker) None 添加一个Marker。
delMarker(marker:Marker) None 删除一个Marker。
getMarkers() Array[Marker] 获取所有Marker。
updateIcon(Boolean) None 根据需要在地图上更新图标位置,以及文字。缺省或false为立即渲染,否则为暂不渲染。
getMLength() Number 获取包含的marker数量。
isInBounds(marker:Marker) Boolean 判断marker是否在格子内。
isContain(marker:Marker) Boolean 判断 marker 是否在本族内。
remove() None 移除本族。

事件

事件名称 参数 说明
click Array[Marker] 聚合图标被点击时触发此事件,参数为此聚合所包含Marker 集合。