百度地图修改点汇聚样式(JS地图)
来源:互联网 发布:unity ugui背包 数据 编辑:程序博客网 时间:2024/05/02 02:18
javascript版百度地图进行点汇聚并更改样式,引入百度开源类库TextIconOverlay_min.js和MarkerClusterer_min.js,使用BMapLib.MarkerClusterer(map, options)进行点聚合:
BMapLib.MarkerClusterer(map, options)
MarkerClusterer
- 参数:
- {Map} map
- 地图的一个实例。
- {Json Object} options
- 可选参数,可选项包括:
markers {Array} 要聚合的标记数组
girdSize {Number} 聚合计算时网格的像素大小,默认60
maxZoom {Number} 最大的聚合级别,大于该级别就不进行相应的聚合
minClusterSize {Number} 最小的聚合数量,小于该数量的不能成为一个聚合,默认为2
isAverangeCenter {Boolean} 聚合点的落脚位置是否是所有聚合在内点的平均值,默认为否,落脚在聚合内的第一个点
styles {Array} 自定义聚合后的图标风格,请参考TextIconOverlay类
<!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:500px;}p{margin-left:5px; font-size:14px;}</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{background-size:100% 100%}<div id="allmap"></div><p>缩放地图,查看点聚合效果</p></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 pt = null;var i = 0;for (; i < MAX; i++) { pt = new BMap.Point(Math.random() * 40 + 85, Math.random() * 30 + 21); markers.push(new BMap.Marker(pt));} var _styles =[{url:"http://******/wx/image/currentday.png",size: new BMap.Size(40, 40)}]//最简单的用法,生成一个marker数组,然后调用markerClusterer类即可。 var markerClusterer = new BMapLib.MarkerClusterer(map, {markers:markers,styles:_styles});</script>
0 0
- 百度地图修改点汇聚样式(JS地图)
- 百度地图点聚合的聚合点样式修改
- 百度地图修改鼠标样式
- 百度地图修改鼠标样式
- 浅谈百度地图的简单开发之引入基本地图以及修改地图样式(一)
- 百度地图的简单开发之引入基本地图以及修改地图样式(一)
- 解决百度地图、高德地图自定义点汇聚图片无法平铺问题
- js 百度地图加载大量点
- 百度地图取点
- 百度地图聚合点
- 百度地图 (定位、回到定位点)
- js百度地图
- js引入百度地图
- js百度地图
- js调用百度地图
- 百度地图js小结
- 百度地图JS
- 百度地图JS--2
- greenlet 详解
- VUE多层路由嵌套
- php删除文件以及目录
- WannaCry勒索病毒处理指南
- TNS-12535 TNS-00505的处理方法
- 百度地图修改点汇聚样式(JS地图)
- 驱动文章列表
- 解决Android 5.0以下出现 java.lang.NoClassDefFoundError,找不到类
- ubuntu的last命令查看系统登录信息
- Leetcode题解
- 持续更新 ing | Wannacry 勒索病毒专题
- Qt程序打包发布方法(使解决QML打包后不能启动的bug)
- 图形学学习网站记录
- Spring集合注入的方式