百度地图点聚合实现方法

最新推荐文章于 2024-01-29 09:51:06 发布

尤成军军军

最新推荐文章于 2024-01-29 09:51:06 发布

阅读量4.8k

点赞数 2

分类专栏： # 百度地图文章标签：百度地图点聚合

本文链接：https://blog.csdn.net/qq_31083947/article/details/54754902

版权

百度地图专栏收录该内容

3 篇文章 0 订阅

订阅专栏

百度地图点聚合代码如下

<!DOCTYPE>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></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>
 </head>
  <body>	
    <div id="mapDiv" style="height:400px; width:600px;"></div>
  </body>

   <script type="text/javascript">
   	   //基本配置
       var map = new BMap.Map("mapDiv");
       map.enableScrollWheelZoom();
       var point = new BMap.Point(118.404, 39.915);
       map.centerAndZoom(point, 5);
       
       //将所有点放入数组
       var markers = [];
       for (var i=0; i < 128; i++) {
           var pt = new BMap.Point(Math.random() * 50 + 85, Math.random() * 70 + 21);
           markers.push(new BMap.Marker(pt));
       }
       //数组放入聚合方法
       var markerClusterer = new BMapLib.MarkerClusterer(map, {markers:markers});
    </script>
</html>

点聚合效果视频演示： http://www.bilibili.com/video/av8246622/

尤成军军军

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
百度地图点聚合实现方法

百度地图点聚合代码如下 //基本配置 var map = new BMap.Map("mapDiv"); map.enableScrollWheelZoom(); var point = new BMap.Point(118.404, 39.915);
复制链接

扫一扫