浏览器版本低!无法浏览完整内容,建议升级或更换浏览器。

文档全面上新

更科技的视觉体验,更高效的页面结构,快前往体验吧!

体验新版
 
第1行: 第1行:
 
<div id="examples_center"><!-- 页面标题 --><div class="title-hd">点聚合</div><!-- 标题下子标题及简介,可有多个 --><div class="title-mi">功能场景</div><div class="wrap-mi">通过该功能可以避免因Marker绘制过多呈现拥挤的情况,获得更优的展示效果,常用于充电桩、房产等app中。</div><!--  --></div><div class="demos_wrap"><div class="header"><div class="andiord-header active">Android</div><div class="ios-header">iOS</div></div><div class="andiord-wrap wrap"><div class="wrap-wp"><div class="wrap_left"><div class="left-video"><div class="img-bg-and"></div><div class="phone-android"><div class="video-wrap infor"><div class="video-control"></div><!-- 安卓视频位置 (不写协议)--><pre>//mapopen-website-wiki.bj.bcebos.com/demos/AndroidVideos/Android点聚合.mp4</pre>
 
<div id="examples_center"><!-- 页面标题 --><div class="title-hd">点聚合</div><!-- 标题下子标题及简介,可有多个 --><div class="title-mi">功能场景</div><div class="wrap-mi">通过该功能可以避免因Marker绘制过多呈现拥挤的情况,获得更优的展示效果,常用于充电桩、房产等app中。</div><!--  --></div><div class="demos_wrap"><div class="header"><div class="andiord-header active">Android</div><div class="ios-header">iOS</div></div><div class="andiord-wrap wrap"><div class="wrap-wp"><div class="wrap_left"><div class="left-video"><div class="img-bg-and"></div><div class="phone-android"><div class="video-wrap infor"><div class="video-control"></div><!-- 安卓视频位置 (不写协议)--><pre>//mapopen-website-wiki.bj.bcebos.com/demos/AndroidVideos/Android点聚合.mp4</pre>
</div><div class="video-icon-and"><div class="play play-and"></div><div class="stop stop-and"></div></div></div><div class="progressWrap-hide-and"></div><div id="videoControls-and"><div id="progressWrap-and"><div id="playProgress-and"></div></div></div></div><div class="left-qrCode"><!-- 安卓二维码位置 --><div class="qrCode-and">1590746640|//mapopen-website-wiki.bj.bcebos.com/demos/newqrcodes/点聚合.png</div><div>扫码体验</div></div></div><div class="wrap_right"><div class="wrap_right_nav"><div class="wrap_right_nav_l"><div>使用产品</div><div><!-- 安卓使用产品下选项,可有多个 --><!-- 产品1|/index.php?title=test --><div class="documentA">Android地图SDK|/index.php?title=androidsdk</div><div>></div><div class="documentA">点聚合|/index.php?title=androidsdk/guide/render-map/conflux</div></div></div><div class="wrap_right_nav_r">下载源码</div><!-- 安卓源码地址 --><div class="github-url-and">//mapopen-website-wiki.bj.bcebos.com/demos/BaiduMapSDKExample.zip</div></div><div class="wrap_table"><div class="table_nav"><div class="left-icon"></div><div>核心接口</div></div><div class="table_wrap"><div class="table_wrap_title"><div>类</div><div>接口</div><div>描述</div></div><!-- 表格接口,可有多个 --><div class="table_wrap_con"><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>addItems(Collection&lt;T&gt; items</div></div><div><div>添加一组聚合点</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>addItem(T myItem)</div></div><div><div>添加单个聚合点</div></div></div><!--  --><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>removeItem(T item)</div></div><div><div>移除单个聚合点</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>setOnClusterClickListener(OnClusterClickListener&lt;T&gt; listener)</div></div><div><div>设置聚合簇点击回调</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>setOnClusterItemClickListener(OnClusterItemClickListener&lt;T&gt; listener)</div></div><div><div>设置单个聚合点点击回调</div></div></div></div></div></div></div></div><div class="pre-nav"><div class="left-icon"></div><div>重点关注</div></div><div class="pre-nav" style="margin-left: 10px;"><div>注意在地图加载完成回调里添加聚合点</div></div><div class="pre-wrap"><div class="pre-wrap-nav"><div>JAVA</div></div><!-- 安卓示例代码位置 --><div class="pre-wrap-w pre-wrap-w-and"><pre class="prettyprint prettyprinted pre-and">mBaiduMap.setOnMapLoadedCallback(new BaiduMap.OnMapLoadedCallback() {
+
</div><div class="video-icon-and"><div class="play play-and"></div><div class="stop stop-and"></div></div></div><div class="progressWrap-hide-and"></div><div id="videoControls-and"><div id="progressWrap-and"><div id="playProgress-and"></div></div></div></div><div class="left-qrCode"><!-- 安卓二维码位置 --><div class="qrCode-and">1590746640|//mapopen-website-wiki.bj.bcebos.com/demos/newqrcodes/点聚合.png</div><div>扫码体验</div></div></div><div class="wrap_right"><div class="wrap_right_nav"><div class="wrap_right_nav_l"><div>使用产品</div><div><!-- 安卓使用产品下选项,可有多个 --><div class="documentA">Android地图SDK|/index.php?title=androidsdk</div><div>></div><div class="documentA">点聚合|/index.php?title=androidsdk/guide/render-map/conflux</div></div></div><div class="wrap_right_nav_r">下载源码</div><!-- 安卓源码地址 --><div class="github-url-and">//mapopen-website-wiki.bj.bcebos.com/demos/BaiduMapSDKExample.zip</div></div><div class="wrap_table"><div class="table_nav"><div class="left-icon"></div><div>核心接口</div></div><div class="table_wrap"><div class="table_wrap_title"><div>类</div><div>接口</div><div>描述</div></div><!-- 表格接口,可有多个 --><div class="table_wrap_con"><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>addItems(Collection&lt;T&gt; items</div></div><div><div>添加一组聚合点</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>addItem(T myItem)</div></div><div><div>添加单个聚合点</div></div></div><!--  --><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>removeItem(T item)</div></div><div><div>移除单个聚合点</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>setOnClusterClickListener(OnClusterClickListener&lt;T&gt; listener)</div></div><div><div>设置聚合簇点击回调</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">ClusterManager</div></div><div><div>setOnClusterItemClickListener(OnClusterItemClickListener&lt;T&gt; listener)</div></div><div><div>设置单个聚合点点击回调</div></div></div></div></div></div></div></div><div class="pre-nav"><div class="left-icon"></div><div>重点关注</div></div><div class="pre-nav" style="margin-left: 10px;"><div>注意在地图加载完成回调里添加聚合点</div></div><div class="pre-wrap"><div class="pre-wrap-nav"><div>JAVA</div></div><!-- 安卓示例代码位置 --><div class="pre-wrap-w pre-wrap-w-and"><pre class="prettyprint prettyprinted pre-and">mBaiduMap.setOnMapLoadedCallback(new BaiduMap.OnMapLoadedCallback() {
 
     @Override
 
     @Override
 
     public void onMapLoaded() {
 
     public void onMapLoaded() {
第56行: 第56行:
 
                 </pre>
 
                 </pre>
 
<div class="pre-btn"><div class="pre-btn-copy-and">复制</div><div class="pre-btn-cb-and">深色</div></div><div class="success">复制成功</div></div></div></div><div class="ios-wrap wrap" style="display: none;"><div class="wrap-wp"><div class="wrap_left"><div class="left-video"><div class="img-bg-ios-sh"></div><div class="phone-ios"><div class="video-wrap infor"><div class="video-control"></div><!-- ios视频位置 --><pre>//mapopen-website-wiki.bj.bcebos.com/demos/iosVideos/iOS点聚合.mov</pre>
 
<div class="pre-btn"><div class="pre-btn-copy-and">复制</div><div class="pre-btn-cb-and">深色</div></div><div class="success">复制成功</div></div></div></div><div class="ios-wrap wrap" style="display: none;"><div class="wrap-wp"><div class="wrap_left"><div class="left-video"><div class="img-bg-ios-sh"></div><div class="phone-ios"><div class="video-wrap infor"><div class="video-control"></div><!-- ios视频位置 --><pre>//mapopen-website-wiki.bj.bcebos.com/demos/iosVideos/iOS点聚合.mov</pre>
</div><div class="video-icon-ios"><div class="play play-ios"></div><div class="stop stop-ios"></div></div></div><div class="progressWrap-hide-ios"></div><div id="videoControls-ios"><div id="progressWrap-ios"><div id="playProgress-ios"></div></div></div></div><div class="left-qrCode iosqrCode"><!-- ios二维码位置 --><div class="qrCode-ios">1590746640|//mapopen-website-wiki.bj.bcebos.com/demos/ioscodes/点聚合@1xios.png</div><div>扫码体验</div></div></div><div class="wrap_right"><div class="wrap_right_nav"><div class="wrap_right_nav_l"><div>使用产品</div><div><!-- IOS使用产品下选项,可有多个 --><!-- 产品1|/index.php?title=test --><div class="documentA">iOS地图SDK|/index.php?title=iossdk</div><!--  --><div>></div><div class="documentA">点聚合|/index.php?title=iossdk/guide/map-render/pointPoly</div></div></div><div class="wrap_right_nav_r">下载源码</div><!-- IOS源码地址 --><div class="github-url-ios">//mapopen-website-wiki.bj.bcebos.com/BaiduMapSDKDemo.zip</div></div><div class="wrap_table"><div class="table_nav"><div class="left-icon"></div><div>核心接口</div></div><div class="table_wrap"><div class="table_wrap_title"><div>类</div><div>接口</div><div>描述</div></div><!-- ios表格接口内容,可有多个 --><!-- 表格接口,可有多个 --><div class="table_wrap_con"><div class="table_wrap_w"><div><div class="table-wrap-className">BMKClusterManager</div></div><div><div>- (void)clearClusterItems;</div></div><div><div>清除标注集群items</div></div></div><!--  --><div class="table_wrap_w"><div><div class="table-wrap-className">BMKClusterManager</div></div><div><div>- (NSArray&lt;BMKCluster *&gt; *)getClusters:(CGFloat)zoomLevel;</div></div><div><div>根据地图缩放级别获取标注集群</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">BMKMapView</div></div><div><div>- (BMKAnnotationView *)mapView:(BMKMapView *)mapView viewForAnnotation:(id&lt;BMKAnnotation&gt;)annotation;</div></div><div><div>向地图添加标注</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">BMKMapView</div></div><div><div>- (void)mapViewDidFinishLoading:(BMKMapView *)mapView;</div></div><div><div>地图加载完成时会调用此方法</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">BMKMapView</div></div><div><div>- (void)mapView:(BMKMapView *)mapView onDrawMapFrame:(BMKMapStatus *)status;</div></div><div><div>地图渲染每一帧画面过程中,以及每次需要重新绘制地图时(例如添加覆盖物)都会调用此方法</div></div></div></div></div></div></div></div><div class="pre-nav"><div class="left-icon"></div><div>核心代码</div></div><div class="pre-wrap"><div class="pre-wrap-nav"><div>Objective-C</div></div><div class="pre-wrap-w pre-wrap-w-ios code_container"><!-- ios示例代码位置 --><pre class="prettyprint prettyprinted pre-ios">/** 更新标注展示. */
+
</div><div class="video-icon-ios"><div class="play play-ios"></div><div class="stop stop-ios"></div></div></div><div class="progressWrap-hide-ios"></div><div id="videoControls-ios"><div id="progressWrap-ios"><div id="playProgress-ios"></div></div></div></div><div class="left-qrCode iosqrCode"><!-- ios二维码位置 --><div class="qrCode-ios">1590746640|//mapopen-website-wiki.bj.bcebos.com/demos/ioscodes/点聚合@1xios.png</div><div>扫码体验</div></div></div><div class="wrap_right"><div class="wrap_right_nav"><div class="wrap_right_nav_l"><div>使用产品</div><div><!-- IOS使用产品下选项,可有多个 --><div class="documentA">iOS地图SDK|/index.php?title=iossdk</div><!--  --><div>></div><div class="documentA">点聚合|/index.php?title=iossdk/guide/map-render/pointPoly</div></div></div><div class="wrap_right_nav_r">下载源码</div><!-- IOS源码地址 --><div class="github-url-ios">//mapopen-website-wiki.bj.bcebos.com/BaiduMapSDKDemo.zip</div></div><div class="wrap_table"><div class="table_nav"><div class="left-icon"></div><div>核心接口</div></div><div class="table_wrap"><div class="table_wrap_title"><div>类</div><div>接口</div><div>描述</div></div><!-- ios表格接口内容,可有多个 --><!-- 表格接口,可有多个 --><div class="table_wrap_con"><div class="table_wrap_w"><div><div class="table-wrap-className">BMKClusterManager</div></div><div><div>- (void)clearClusterItems;</div></div><div><div>清除标注集群items</div></div></div><!--  --><div class="table_wrap_w"><div><div class="table-wrap-className">BMKClusterManager</div></div><div><div>- (NSArray&lt;BMKCluster *&gt; *)getClusters:(CGFloat)zoomLevel;</div></div><div><div>根据地图缩放级别获取标注集群</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">BMKMapView</div></div><div><div>- (BMKAnnotationView *)mapView:(BMKMapView *)mapView viewForAnnotation:(id&lt;BMKAnnotation&gt;)annotation;</div></div><div><div>向地图添加标注</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">BMKMapView</div></div><div><div>- (void)mapViewDidFinishLoading:(BMKMapView *)mapView;</div></div><div><div>地图加载完成时会调用此方法</div></div></div><div class="table_wrap_w"><div><div class="table-wrap-className">BMKMapView</div></div><div><div>- (void)mapView:(BMKMapView *)mapView onDrawMapFrame:(BMKMapStatus *)status;</div></div><div><div>地图渲染每一帧画面过程中,以及每次需要重新绘制地图时(例如添加覆盖物)都会调用此方法</div></div></div></div></div></div></div></div><div class="pre-nav"><div class="left-icon"></div><div>核心代码</div></div><div class="pre-wrap"><div class="pre-wrap-nav"><div>Objective-C</div></div><div class="pre-wrap-w pre-wrap-w-ios code_container"><!-- ios示例代码位置 --><pre class="prettyprint prettyprinted pre-ios">/** 更新标注展示. */
 
- (void)updateClusters {
 
- (void)updateClusters {
 
     _clusterZoom = (NSInteger)_mapView.zoomLevel;
 
     _clusterZoom = (NSInteger)_mapView.zoomLevel;

2022年2月25日 (五) 17:19的最后版本

点聚合
功能场景
通过该功能可以避免因Marker绘制过多呈现拥挤的情况,获得更优的展示效果,常用于充电桩、房产等app中。
Android
iOS
//mapopen-website-wiki.bj.bcebos.com/demos/AndroidVideos/Android点聚合.mp4
1590746640|//mapopen-website-wiki.bj.bcebos.com/demos/newqrcodes/点聚合.png
扫码体验
使用产品
Android地图SDK|/index.php?title=androidsdk
>
点聚合|/index.php?title=androidsdk/guide/render-map/conflux
下载源码
//mapopen-website-wiki.bj.bcebos.com/demos/BaiduMapSDKExample.zip
核心接口
接口
描述
ClusterManager
addItems(Collection<T> items
添加一组聚合点
ClusterManager
addItem(T myItem)
添加单个聚合点
ClusterManager
removeItem(T item)
移除单个聚合点
ClusterManager
setOnClusterClickListener(OnClusterClickListener<T> listener)
设置聚合簇点击回调
ClusterManager
setOnClusterItemClickListener(OnClusterItemClickListener<T> listener)
设置单个聚合点点击回调
重点关注
注意在地图加载完成回调里添加聚合点
JAVA
mBaiduMap.setOnMapLoadedCallback(new BaiduMap.OnMapLoadedCallback() {
    @Override
    public void onMapLoaded() {

        // 添加marker
        initCluster();
        addMarkers();

        // 设置初始中心点为北京
        LatLng center = new LatLng(39.963175, 116.400244);

        // 需要更新下地图状态,聚合点才会显示出来
        MapStatusUpdate mapStatusUpdate = MapStatusUpdateFactory.newLatLngZoom(center, 10);
        mBaiduMap.setMapStatus(mapStatusUpdate);
    }
});
                
复制
深色
复制成功
核心代码
1.初始化
JAVA
private void initCluster() {
    // 定义点聚合管理类ClusterManager
    mClusterManager = new ClusterManager<MyItem>(this, mBaiduMap);
    mBaiduMap.setOnMapStatusChangeListener(mClusterManager);
    mBaiduMap.setOnMarkerClickListener(mClusterManager);

    mClusterManager
            .setOnClusterClickListener(new ClusterManager.OnClusterClickListener<MyItem>() {

                @Override
                public boolean onClusterClick(Cluster<MyItem> cluster) {
                    Toast.makeText(ClusterMarkerActivity.this, "有" + cluster.getSize() + "个点",
                            Toast.LENGTH_SHORT).show();
                    return false;
                }
            });
    mClusterManager.setOnClusterItemClickListener(
            new ClusterManager.OnClusterItemClickListener<MyItem>() {
                @Override
                public boolean onClusterItemClick(MyItem item) {
                    Toast.makeText(ClusterMarkerActivity.this, "点击单个Item", Toast.LENGTH_SHORT)
                            .show();
                    return false;
                }
            });
}
                
复制
深色
复制成功
2.添加item
JAVA
/**
* 向地图添加Marker点
*/
public void addMarkers() {
    // 添加Marker点

    List<MyItem> items = getMaytiems();

    mClusterManager.addItems(items);
}
                
复制
深色
复制成功
  • 文档根本没法用

  • 文档水平很差

  • 文档水平一般

  • 文档不错

  • 文档写的很好

如发现文档错误,或对此文档有更好的建议,请在下方反馈。问题咨询请前往反馈平台提交工单咨询。

提交反馈

拖动标注工具

添加矩形标注

添加箭头标注

完成

取消