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

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. WebService简单使用

    1.创建Webservice服务应用程序 方式一:将VS2010采用的默认框架,改为使用框架.NET Framework2.0\3.0\3.5,这时新建"项目"or新建" ...

  2. redisbook笔记——redis内存映射数据结构

    虽然内部数据结构非常强大,但是创建一系列完整的数据结构本身也是一件相当耗费内存的工作,当一个对象包含的元素数量并不多,或者元素本身的体积并不大时,使用代价高昂的内部数据结构并不是最好的办法. 为了解决 ...

  3. （转）织梦cms首页添加digg顶一下的修改方法

    现在把文章内容页拔的顶拔出来.分享一下让各位需要的朋友参考使用(特别注意:红色的是修改的地方)第一步:把顶踩的js和ajax提取出来,放在想要使用的页面用(比如:首页)以下是内容页顶踩用的js.提取出 ...

  4. （转）echo和print的区别

    在实际使用中, print 和 echo 两者的功能几乎是完全一样.可以这么说,凡是有一个可以使用的地方,另一个也可以使用.但是,两者之间也还是一个非常重要的区别:在 echo 函数中,可以同时输出多 ...

  5. [转]Traits 编程技法+模板偏特化+template参数推导+内嵌型别编程技巧

    STL中,traits编程技法得到了很大的应用,了解这个,才能一窥STL奥妙所在. 先将自己所理解的记录如下: Traits技术可以用来获得一个 类型 的相关信息的. 首先假如有以下一个泛型的迭代器类 ...

  6. 小议window.event || ev

    以前做项目时就遇到这个问题,但是太懒没有总结,今天来总结一下 onclick="alert(arguments.callee)"这句随便放在某个元素中,试试不同的浏览器会有弹出什么 ...

  7. shell之小括号、中括号、大括号

    1.Shell中变量的原形:${var}  一串命令的执行 #等价于 $ var=test $ echo $var test #例如,用在这个位置 $ echo ${var}AA testAA 2.命 ...

  8. poj 4982 踩方格

    4982:踩方格 查看 提交 统计 提问 总时间限制:  1000ms 内存限制:  65536kB 描述 有一个方格矩阵,矩阵边界在无穷远处.我们做如下假设:a.    每走一步时,只能从当前方格移 ...

  9. 『SQL注入』 User-Agent 手工注入的探测与利用分析

    原理很简单:后台在接收UA时没有对UA做过滤,也没有PDO进行数据交互(实际PDO是非常有必要的),导致UA中有恶意代码,最终在数据库中执行. Bug 代码: 本地顺手打了一个环境,Bug 代码部分: ...

  10. php通过curl实现bigpipe

    BigPipe是facebook发明的一种页面加载技术.其实也不是什么新技术了,也有很多文章进行说明.但是在网上,具体讲如何使用php实现bigpipe的文章很少,并且有些文章还不很准确.bigpip ...