百度点聚合用来解决加载大量点要素到地图上产生覆盖现象的问题，并提高性能。

http://api.map.baidu.com/library/MarkerClusterer/1.2/docs/symbols/BMapLib.MarkerClusterer.html

最基本的实现（在此两个按钮的功能没有实现）：

<!DOCTYPE html>

<html>

<head>

	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

	<style type="text/css">

		body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}

		#allmap{width:100%;height:80%;}

		#r-result{width:100%;}

	</style>

	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

	<script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script>

	<script type="text/javascript" src="http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script>

	<title>点聚合</title>

</head>

<body>

	<div id="allmap"></div>

	<div id="r-result">

		<input type="button" onclick="add_overlay();" value="添加点聚合" />

		<input type="button" onclick="remove_overlay();" value="重新生成点聚合" />

	</div>

</body>

</html>

<script type="text/javascript">

	// 百度地图API功能

	var map = new BMap.Map("allmap");

	map.centerAndZoom(new BMap.Point(116.404, 39.915), 4);

	map.enableScrollWheelZoom();

	var MAX = 10;

	var markers = [];

	var markerClusterer = null;

	for (var i = 0; i < MAX; i++) {

		var pt = new BMap.Point(Math.random()*40+85, Math.random()*30+21);

		var marker = new BMap.Marker(pt);

		map.addOverlay(marker);

		markers.push(marker);

	}

	//最简单的用法，生成一个marker数组，然后调用markerClusterer类即可。

	markerClusterer = new BMapLib.MarkerClusterer(map, {markers:markers});

</script>

实现两个按钮的功能，用于添加点聚合，和删除点聚合并重新加载新的点

<!DOCTYPE html>

<html>

<head>

	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

	<style type="text/css">

		body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}

		#allmap{width:100%;height:80%;}

		#r-result{width:100%;}

	</style>

	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

	<script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script>

	<script type="text/javascript" src="http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script>

	<title>点聚合</title>

</head>

<body>

	<div id="allmap"></div>

	<div id="r-result">

		<input type="button" onclick="add_overlay();" value="添加点聚合" />

		<input type="button" onclick="remove_overlay();" value="重新生成点聚合" />

	</div>

</body>

</html>

<script type="text/javascript">

	// 百度地图API功能

	var map = new BMap.Map("allmap");

	map.centerAndZoom(new BMap.Point(116.404, 39.915), 4);

	map.enableScrollWheelZoom();

	var MAX = 10;

	var markers = [];

	var markerClusterer = null;

	for (var i = 0; i < MAX; i++) {

		var pt = new BMap.Point(Math.random()*40+85, Math.random()*30+21);

		var marker = new BMap.Marker(pt);

		map.addOverlay(marker);

		markers.push(marker);

	}

	function add_overlay(){

		//最简单的用法，生成一个marker数组，然后调用markerClusterer类即可。

		markerClusterer = new BMapLib.MarkerClusterer(map, {markers:markers});

	}

	function remove_overlay(){

		for(var i=0; i<4; i++){

			map.removeOverlay(markers[i]);

		}

		var markers1 = markers.slice(4,markers.length);

		markerClusterer.clearMarkers();			//此步骤需要

		markerClusterer = new BMapLib.MarkerClusterer(map, {markers:markers1});

	}

</script>

百度地图API 重新生成点聚合的功能的更多相关文章

  1. 百度地图API 批量添加 带检索功能的信息窗口

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 百度地图API的自动定位和搜索功能（移动端）

    近期有个项目涉及到百度地图API,要求做到自动定位和搜索功能.煞费苦心的研究半天,终于能将两个功能合二为一,现将代码贴出来分享给大家,希望你们的砖搬得又快又好.注释不多,具体请参照:http://lb ...

  3. 吐槽贴：百度地图 api 封装 的实用功能 [源码下载]

    ZMap 类 功能介绍 ZMap 是学习百度地图 api 接口,开发基本功能后整的一个脚本类,本类方法功能大多使用 prototype 原型 实现: 包含的功能有:轨迹回放,圈画区域可编辑,判断几个坐 ...

  4. 深入浅出百度地图API开发系列（3）：模块化设计

    在前面两张简单介绍了百度地图API的基础知识和使用之后,我们来分析一下百度地图API的基本架构,了解一下基本架构可以帮助我们更清晰的了解API的功能和调用过程,也就可以帮助我们在实际开发中可以更方便的 ...

  5. 百度地图API功能集锦

    1.点个数太多导致加载缓慢的解决. 2.可视化区域内加载的解决. 3.自定义信息窗口解决. 4.区域/板块/商圈等的绘制功能解决. 基本包含了用到百度地图API会使用到的大部分常规性场景.(聚合点功能 ...

  6. 百度地图API多个点聚合时，标注添加的标签label地图刷新就丢失的问题解决

    当将自定义的Marker(含有Label)通过MarkerClusterer 管理的时候,当地图发生任何移动.缩放 的时候,Marker 的Label 就会自动消失. 这个问题主要是由于百度的点聚合A ...

  7. 百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 [源码下载]

    相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修正版[ZMap.js] 实例源码! ZMap.js 本类方法功能大多使用 ...

  8. 【百度地图API】除夕夜，大家一起来赶走“夕”——删除标注功能

    原文:[百度地图API]除夕夜,大家一起来赶走"夕"--删除标注功能 任务描述: 农历12月31日是中国传统的节日——除夕.你知道除夕是怎么来的麼? “夕”在中国古代神话中,可是一 ...

  9. 【百度地图API】情人节求爱大作战——添加标注功能

    原文:[百度地图API]情人节求爱大作战--添加标注功能 任务描述: 2月2日是除夕,2月14立马来!即将到来的情人节,你想送TA一份什么礼物呢? 不如,在你们居住的地方,画个大大的桃心,表达你对TA ...

随机推荐

  1. winapi获取鼠标位置

    using System; using System.Drawing; using System.Runtime.InteropServices; using System.Threading; na ...

  2. jdbc_odbc SQLserver 驱动安装及测试

    有2次被问到同一个问题,尽管博客园是.net的园子,我还是分享下吧.PS:我现在做的.net,以前学过点java.献丑了. ------------------ 原始邮件 -------------- ...

  3. repeater控件 + marquee标签 实现文字滚动显示

    各种信息网站.BBS等网站上的公告信息模块的实现 拖出一个repeater控件绑定数据库中要显示的信息 在repeater的 <ItemTemplate> ... </ItemTem ...

  4. OC中的单例设计模式及单例的宏抽取

    // 在一个对象需要重复使用,并且很频繁时,可以对对象使用单例设计模式 // 单例的设计其实就是多alloc内部的allocWithZone下手,重写该方法 #pragma Person.h文件 #i ...

  5. emmt html生成

    html:5  或 ! html:5 或!:用于HTML5文档类型 html:xt:用于XHTML过渡文档类型 html:4s:用于HTML4严格文档类型 常用过渡文档类型  html:xt  直接c ...

  6. jQuery firefox chrome IE 绑定mousewheel事件

    $doc.on('mousewheel DOMMouseScroll',function(){ $htmlBody.stop(true); $goTop.stop(true); });

  7. phpcms v9自定义表单提交后返回上一页实现方法

    PHPcms v9中提交自定义表单后默认都是回到首页的,是不是感觉很不爽! 接下来,就说下phpcms v9自定义表单提交后返回上一页实现方法. 1.找到这个文件 phpcms\modules\for ...

  8. Flask学习记录之使用Werkzeug散列密码

    数据库中直接存放明文密码是很危险的,Werkzeug库中的security能够方便的实现散列密码的计算 security库中 generate_password_hash(password,metho ...

  9. Symmetry（对称轴存在问题）

    Symmetry Time Limit:3000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu Description   Th ...

  10. getsockname和getpeername函数

    这2个函数或者返回与某个套接字关联的本地协议地址(getsockname),或者返回与某个套接字关联的外地协议地址(getpeername) int getsockname(int sockfd, s ...