leaflet聚类——leaflet.markercluster

news/2024/5/20 5:59:24 标签: 聚类, 数据挖掘, 机器学习

leaflet实现为实现mark聚类渲染提供了很好的插件:leaflet.markercluster。

demo查看地址:Leaflet 聚类渲染

插件下载地址:https://github.com/Leaflet/Leaflet.markercluster

用法

创建一个新的 MarkerClusterGroup,将您的标记添加到其中,然后将其添加到地图中

var markers = L.markerClusterGroup();
markers.addLayer(L.marker(getRandomLatLng(map)));
… Add more layers …
map.addLayer(markers);
配置解析:

Clusterer 默认值:

showCoverageOnHover:当您将鼠标悬停在集群上时,它会显示其标记的边界。
zoomToBoundsOnClick:当您单击一个集群时,我们会缩放到其边界。
spiderfyOnMaxZoom:当您单击底部缩放级别的集群时,我们会对其进行蜘蛛化,以便您可以看到其所有标记。(注意:如果集群中的所有项目仍以最大缩放级别或disableClusteringAtZoom选项指定的缩放进行聚类,则spiderfy 发生在当前缩放级别)
removeOutsideVisibleBounds:为了提高性能,从地图中删除离视口太远的集群和标记。
spiderLegPolylineOptions:允许您指定PolylineOptions来设计蜘蛛腿的样式。默认情况下,它们是{ weight: 1.5, color: ‘#222’, opacity: 0.5 }.
默认启用(布尔选项)
showCoverageOnHover:当您将鼠标悬停在集群上时,它会显示其标记的边界。
zoomToBoundsOnClick:当您单击一个集群时,我们会缩放到其边界。
spiderfyOnMaxZoom:当您单击底部缩放级别的集群时,我们会对其进行蜘蛛化,以便您可以看到其所有标记。(注意:如果集群中的所有项目仍以最大缩放级别或disableClusteringAtZoom选项指定的缩放进行聚类,则spiderfy 发生在当前缩放级别)。
removeOutsideVisibleBounds:为了提高性能,从地图中删除离视口太远的集群和标记。
animate:缩放和蜘蛛化时平滑拆分/合并集群子项。如果L.DomUtil.TRANSITION为 false,则此选项无效(不可能有动画)。
其他选项
animateAddingMarkers:如果设置为 true(并且animate选项也为 true),那么在将标记添加到地图后将单个标记添加到 MarkerClusterGroup 将添加标记并将其动画化到集群中。默认为 false,因为这在批量添加标记时提供了更好的性能。addLayers 不支持这个,只支持带有单独标记的 addLayer。
disableClusteringAtZoom:如果设置,在此缩放级别及以下,标记将不会聚集。这默认为禁用。参见示例。注意:您可能对在spiderfyOnMaxZoom使用时禁用选项感兴趣disableClusteringAtZoom。
maxClusterRadius:集群将从中心标记覆盖的最大半径(以像素为单位)。默认 80。减少将产生更多、更小的集群。您还可以使用接受当前地图缩放并返回最大聚类半径(以像素为单位)的函数。
多边形选项:创建 L.Polygon(points, options) 以显示集群边界时传递的选项。默认为空,这让 Leaflet 使用默认的 Path options。
singleMarkerMode:如果设置为 true,则覆盖所有添加的标记的图标,使它们显示为 1 大小的集群。注意:标记不会被集群对象替换,只会替换它们的图标。因此他们仍然对正常事件做出反应,并且选项disableClusteringAtZoom不会恢复他们以前的图标(参见#391)。
spiderLegPolylineOptions:允许您指定PolylineOptions来设计蜘蛛腿的样式。默认情况下,它们是{ weight: 1.5, color: ‘#222’, opacity: 0.5 }.
SpiderfyDistanceMultiplier:从 1 增加以增加与放置蜘蛛化标记的中心的距离。如果您使用大标记图标(默认值:1),请使用。
iconCreateFunction:用于创建集群图标的函数。请参阅默认实现或自定义示例。
spiderfyShapePositions : 用于覆盖 spiderfy 默认形状位置的函数。
clusterPane:将添加集群图标的地图窗格。默认为 L.Marker 的默认值(当前为“markerPane”)。请参阅窗格示例。
分块 addLayers 选项
addLayers方法的选项。有关分块如何工作的解释,请参见#357。

chunkedLoading : 布尔值,将 addLayer的处理分成小间隔,以便页面不会冻结。
chunkInterval : addLayers 在暂停以让页面的其余部分处理之前工作的时间间隔(以毫秒为单位)。特别是,这可以防止页面在添加大量标记时冻结。默认为 200 毫秒。
chunkDelay:addLayers 的连续处理周期之间的时间延迟(以毫秒为单位)。默认为 50 毫秒。
chunkProgress:在每个 chunkInterval 结束时调用的回调函数。通常用于实现进度指示器,例如RealWorld 50k 中的代码。默认为空。参数:

已处理标记数
添加的标记总数
已用时间(以毫秒为单位)


http://www.niftyadmin.cn/n/5330670.html

相关文章

Nvidia-docker的基础使用方法

安装: 安装nvidia-docker: distribution$(. /etc/os-release;echo $ID$VERSION_ID)curl -s -L https://nvidia.github.io/nvidia-docker/gpgkey | sudo apt-key add -curl -s -L https://nvidia.github.io/nvidia-docker/$distribution/nvidia-docker.l…

excel(vab)删除空行

删除第一、二、三列位空的所有行(8000)行范围以内 代码如下: Sub Macro1()Dim hang As Integer For hang 8000 To 1 Step -1If Sheet1.Cells(hang, 1) "" And Sheet1.Cells(hang, 2) "" And Sheet1.Cells(hang, 3) "&quo…

史上最全的spring里面之@Transactional原理解析

一、原理: Spring框架中的Transactional注解用于声明式事务管理,它允许开发者在方法级别控制事务的边界。具体原理如下: 代理机制: Spring通过AOP(面向切面编程)来实现事务管理。当一个类的方法上标注了Tr…

笛卡尔空间圆弧轨迹规划算法——梯形和S形加减速算法(含详细推导和代码)

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 目录 前言 1 算法思想 2 算法原理 2.1 圆弧轨迹圆心及半径计算 2.2 坐标变换 2.3 路径点及圆心点的坐标变换 2.4 新坐标系下的圆弧插补 2.4.1 求解θ3 3 仿真验证 4 总结 前言…

点云从入门到精通技术详解100篇-基于点云配准的无纹理堆叠物体 6D 位姿估计

目录 前言 点云分割算法研究现状 边缘提取法 模型匹配法 区域生长法

Vue的路由实现:hash模式 和 history模式原理

Hash 模式: 在 hash 模式下,URL 中的路由信息会以 # 符号后的内容表示,例如 http://example.com/#/home。当 URL 中的 hash 发生变化时,浏览器不会向服务器发送请求,而是通过监听 hashchange 事件来响应 URL 的变化&am…

JVM实战(19)——JVM调优工具概述

作者简介:大家好,我是smart哥,前中兴通讯、美团架构师,现某互联网公司CTO 联系qq:184480602,加我进群,大家一起学习,一起进步,一起对抗互联网寒冬 学习必须往深处挖&…

2024年腾讯云主机价格表,附报价明细

腾讯云服务器租用价格表:轻量应用服务器2核2G3M价格62元一年、2核2G4M价格118元一年,540元三年、2核4G5M带宽218元一年,2核4G5M带宽756元三年、轻量4核8G12M服务器446元一年、646元15个月,云服务器CVM S5实例2核2G配置280.8元一年…