Leaflet 插件数据库
虽然 Leaflet 的目标是尽可能轻量级,并且专注于核心功能集,但扩展其功能的简单方法是使用第三方插件。感谢 Leaflet 背后的强大社区,有数百种不错的插件可供选择。
瓦片和图像图层
以下插件允许加载不同的地图,并为瓦片和图像图层提供功能。
底图提供者
开箱即用的底图,几乎不需要任何配置。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Azure Maps Leaflet 插件 |
一个 leafletjs 插件,可以轻松地叠加 Azure Maps 提供的所有不同瓦片图层。支持使用 Azure Maps 订阅密钥或 Azure Active Directory 进行身份验证。 |
演示 | Ricky Brundritt |
Bing Maps 图层 |
将 Bing Maps 瓦片 添加到您的 Leaflet 地图。需要 Leaflet v1.0.0.beta.2 或更高版本。 |
演示 | Gregor MacLennan |
Esri Leaflet |
一组用于在 Leaflet 中使用 ArcGIS 服务的工具。支持地图服务、要素图层、ArcGIS Online 瓦片等。 |
Patrick Arlt | |
L.GridLayer.GoogleMutant |
显示 Google 地图(由于使用 DOM 变异观察器 技术,因此只有最少的伪影)。 |
演示 | Iván Sánchez |
L.MapkitMutant |
显示 Apple 的 MapkitJS 底图。 |
Iván Sánchez | |
L.TileLayer.HERE |
显示来自 HERE 地图的地图瓦片。 |
演示 | Iván Sánchez |
L.TileLayer.Kartverket |
提供来自 Kartverket(挪威测绘局)的瓦片图层的轻松设置。 |
Kultur og naturreise | |
Leaflet.ChineseTmsProviders |
包含各种中国瓦片提供者的配置 - 天地图、MapABC、高德等。 |
演示 | Tao Huang |
Leaflet.GIBS |
NASA EOSDIS GIBS 图像集成。该插件提供了 96 个每日更新的图层,包含卫星图像和科学参数。 |
演示 | Alexander Parshin |
Leaflet.KoreanTmsProviders |
包含各种(韩国)韩国瓦片提供者的配置 - Daum、Naver、VWorld 等。 |
Seong Choi | |
Leaflet.Spain.WMS |
提供来自西班牙测绘机构的西班牙多个 Web 地图服务 (WMS) 图层的轻松设置(PNOA、IGN 底图、Catastro 等)。 |
Patricio Soriano | |
Leaflet.TileLayer.HERE |
显示来自 HERE 地图的瓦片。 |
Wanderson Souza | |
Leaflet-Tilelayer-Hong-Kong |
显示来自 香港地理数据存储 提供者的香港地图瓦片。 |
spaceflighter | |
Leaflet.TileLayer.Mierune |
显示来自 Mierune 地图的瓦片。 |
演示 | Mierune |
Leaflet.TileLayer.Swiss |
使用来自 Swisstopo 的地图瓦片显示瑞士的国家地图。 |
演示 | Roman Karavia |
leaflet-providers |
包含各种免费瓦片提供者的配置 - OSM、OpenCycleMap、Stamen、Esri 等。 |
演示 | leaflet-extras 成员 |
PolarMap.js |
一个 JavaScript 库,用于显示来自 ArcticWebMap 的瓦片,这是一个免费的瓦片提供商,在多个北极极地投影中提供 OSM 数据。包括用于更深入地与其他 Leaflet 插件集成的低级 API。 |
GeoSensorWeb 实验室 | |
SuperMap Leaflet |
SuperMap Leaflet 是一个 Leaflet 插件,用于使用 SuperMap 服务类型。支持 SuperMap 服务、瓦片等。 |
演示 | SuperMap |
底图格式
用于加载通用(尽管不是默认)格式的底图或 GIS 光栅图层的插件。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
azgs-leaflet |
一组用于 Leaflet 的小型插件,包括具有过滤功能的 WFS-GeoJSON 图层、GeoJSON 的悬停控件和 Esri 瓦片图层。 |
AZGS | |
cartodb-leaflet |
Leaflet 的官方 CartoDB 插件。 |
Vizzuality | |
GeoRasterLayer |
显示大小不一的 GeoTIFF 文件,具有可配置的分辨率。为简单性和性能而构建。与 GeoBlaze 集成,GeoBlaze 是一个 JavaScript 光栅分析库。 |
演示 | Daniel J. Dufour |
L.TileLayer.WMTS |
一个简单的 Leaflet WMTS 瓦片图层插件。 |
演示 | Alexandru Calin |
Leaflet.bpg |
具有 .bpg 图像格式解码的 TileLayer。 |
Andrzej Zaborowski | |
Leaflet.CanvasLayer.Field |
加载和设置光栅文件(geotiff 和 asciigrid 格式)的样式。它包含一个 |
演示 | Víctor Velarde |
Leaflet GeoJSON Encoded |
使用 Google 折线编码算法扩展 L.GeoJSON 图层,允许优化数据传输。 |
Geobricks | |
Leaflet.ImageOverlay.OGCAPI |
(未平铺)OGC API Maps 草案规范的客户端。 |
演示 | Iván Sánchez Ortega |
Leaflet.NonTiledLayer.WCS |
显示来自 Web Coverage Services 的光栅数据。光栅可以在客户端进行设置样式和查询。 |
演示 | Stuart Matthews |
Leaflet.projwmts |
添加 WMTS 服务(GUGiK 波兰)。 |
演示 | Geoportal 波兰 |
Leaflet.TileLayer.MBTiles |
加载 |
演示 | Iván Sánchez |
leaflet.TileLayer.WMTS |
为 leaflet 添加 WMTS(IGN)分层。 |
Alexandre Melard | |
leaflet.wms |
增强 Leaflet 的 WMS 支持,包括单瓦片/非平铺图层、共享 WMS 源和通过 GetFeatureInfo 进行图层识别。 |
演示 | S. Andrew Sheppard |
Leaflet-2gis |
添加对 2GIS 瓦片图层的支持 |
演示 | Eugene Mikhalev |
leaflet-geotiff |
将来自 geoTIFF 文件的光栅数据显示为图像或方向箭头。光栅可以在客户端进行设置样式和查询。可以应用可选的裁剪蒙版,例如,将 DEM 限制在陆地区域。 |
演示 | Stuart Matthews |
leaflet-tilejson |
为 Leaflet 添加对 TileJSON 规范的支持。 |
Per Liedman | |
TileLayer.GeoJSON |
用于 GeoJSON 瓦片的 TileLayer。 |
Glen Robertson |
非地图底图层
有时您不想加载地图,而只想加载大型自定义图像。非常大的图像。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.TileLayer.IIP |
在 Leaflet 中添加对 IIPImage 图层的支持。 |
演示 | Emmanuel Bertin |
leaflet-fractal |
使用 2D 画布渲染一些分形(曼德博集、朱利亚集和其他一些)。 |
演示 | Alexander Parshin |
Leaflet-IIIF |
一个用于 Leaflet 的 IIIF(国际图像互操作框架)查看器。 |
演示 | Jack Reed |
leaflet-rastercoords |
渲染使用 gdal2tiles-leaflet 生成的较大型平铺图像。图像光栅坐标可用于设置标记等。 |
演示 | Commenthol |
TileLayer.DeepZoom |
用于 DeepZoom 图像的 TileLayer。 |
Al Farisi | |
TileLayer.Gigapan |
用于 Gigapan 图像的 TileLayer。 |
Dan Sherman | |
TileLayer.Zoomify |
用于 Zoomify 图像的 TileLayer。 |
演示 | Bjørn Sandvik |
瓦片/图像显示
以下插件会改变瓦片或图像图层在地图上的显示方式。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.Control.DetailLevel |
通过实时修改 zoomOffset,以高于视网膜 (hdpi) 的分辨率显示瓦片。对于在不同缩放级别之间大幅更改地图样式的映射源很有用。过度增加 zoomOffset 会降低浏览器的速度,因为显示的瓦片数量会随着 zoomOffset 指数增长。 |
演示 | Wessel Valkenburg |
Leaflet.Control.Opacity |
使多个瓦片图层透明。 |
演示 | Yasunori Kirimoto |
Leaflet.Control.SideBySide |
一个 Leaflet 控件,用于添加一个分屏以比较两个地图叠加层。 |
演示 | Digital Democracy |
Leaflet.DistortableImage |
使用户能够 缩放、旋转和扭曲 Leaflet 地图上的图像。 |
演示 | Public Lab |
Leaflet.DistortableVideo |
使用户能够在 Leaflet 地图上缩放、旋转和扭曲视频。 |
演示 | Roni Karilkar |
Leaflet.ImageOverlay.Arrugator |
显示重新投影的 ImageOverlay,给出四个控制点和一个 proj4js 投影函数。 |
演示 | Iván Sánchez Ortega |
Leaflet.ImageOverlay.Rotate |
显示旋转、缩放和倾斜(但不是橡胶板)的 ImageOverlay,给出三个控制点。 |
演示 | Iván Sánchez Ortega |
Leaflet.Multispectral |
为 Leaflet 图像图层提供多光谱通道操作和处理工具(例如 NDVI 或其他遥感方法),使用纯客户端 JavaScript。它通过 ImageOverlay |
演示 | Public Lab |
Leaflet.NonTiledLayers |
用于非平铺叠加层的 Leaflet 图层。 |
演示 | PTV Logistics |
Leaflet.OpacityControls |
简单的 Leaflet 控件,用于调整地图图层的透明度。 |
演示 | Jared Dominguez |
leaflet-rotate |
为 leaflet 地图窗格添加旋转功能。 |
演示 | Raruto |
Leaflet.TileLayer.Canvas |
将瓦片渲染为画布元素。 |
GIAP | |
Leaflet.TileLayer.ColorFilter |
一个简单而轻量级的 Leaflet 插件,用于在地图瓦片上应用 CSS 滤镜。 |
演示 | Cláudio Kawakani |
Leaflet.TileLayer.Colorizr |
一个 Leaflet TileLayer,可以通过 RGBA 代码修改颜色。 |
Hinrich Riedel | |
Leaflet.TileLayer.ColorPicker |
一个具有 getColor(latLng) 的 Leaflet TileLayer。 |
演示 | Yuzo Matsuzawa |
Leaflet.TileLayer.GL |
将自定义 WebGL 着色器应用于瓦片图层中的每个瓦片。 |
演示 | Iván Sánchez |
Leaflet.TileLayer.GLColorScale |
TileLayer 使用 WebGL 根据指定的颜色比例对浮点像素进行着色。 |
演示 | David Schneider |
Leaflet.TileLayer.GLOperations |
WebGL TileLayer:对浮点像素进行着色,为像素值提供鼠标事件处理程序,进行山体阴影、等高线、过渡、滤镜和对多个图层进行计算。 |
演示 | Thorbjørn Horgen |
Leaflet.TileLayer.Mask |
一个具有蒙版效果的 TileLayer。 |
演示 | Yuzo Matsuzawa |
Leaflet.TileLayer.PixelFilter |
一个可以通过 RGB 代码过滤和替换像素的 TileLayer。 |
演示 | GreenInfo Network |
TileLayer.BoundaryCanvas |
允许您使用任意多边形边界绘制瓦片图层。HTML Canvas 用于渲染。 |
Alexander Parshin | |
TileLayer.Grayscale |
一个具有灰度改造的常规 TileLayer。 |
Ilya Zverev |
瓦片加载
以下插件会改变瓦片图层加载到地图中的方式。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.EdgeBuffer |
为 Leaflet 1.0 缓冲视区边缘以外的瓦片。 |
演示 | Alex Paterson |
Leaflet.FeatureGroup.LoadEvents |
|
演示 | G. Lathoud |
Leaflet.FunctionalTileLayer |
允许您使用函数定义瓦片图层 URL。即使使用异步源,也可以使用 promise。 |
Ishmael Smyrnow | |
Leaflet.GridLayer.FadeOut |
当网格图层和切片图层被移除时,会淡出它们,使底图切换更平滑(适用于 1.0.0)。 |
演示 | Iván Sánchez |
Leaflet.loading |
一个简单的控件,在加载切片和其他数据时添加一个加载指示器。 |
演示 | Eric Brelsford |
Leaflet.MultiTileLayer |
允许从多个切片源组成一个 TileLayer。每个源仅在定义的一组缩放级别上处于活动状态。 |
Mattias Bengtsson | |
leaflet.offline |
允许将切片存储在数据库中以供离线访问。 |
演示 | Allart Kooiman |
Leaflet.TileCorrection |
允许以不同于地图的 CRS 加载切片,并从自定义缩放级别开始。 |
Allart Kooiman | |
Leaflet.TileLayer.Fallback |
用从较低缩放级别按比例放大的等效切片替换缺失的切片(HTTP 404 未找到错误)。 |
演示 | ghybs |
TileLayer.Cordova |
用于 Cordova/Phonegap,将切片缓存到本地设备存储中,在离线和在线模式之间切换。 |
Greg Allensworth | |
TileLayer.PouchDBCached |
允许所有 Leaflet TileLayers 缓存到 PouchDB 中以供离线使用。 |
演示 | Iván Sánchez Ortega |
矢量瓦片
用于显示 矢量切片 的插件。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
使用矢量切片的底图 |
Leaflet 的矢量切片插件。利用 MapTiler SDK 的强大功能访问其专业创建的多语言矢量切片底图目录。您还可以将其用于矢量切片数据叠加层。 |
演示 | J. Lurie | MapTiler |
geojson-vt |
用于将 GeoJSON 数据实时切片成矢量切片的有效库。 |
Mapbox | |
Hoverboard |
在画布上用 leaflet 渲染矢量切片(geojson、topojson 和 protobuf)。仅兼容 Leaflet 0.7.x。 |
演示 | Tristan Davies |
Leaflet.MapboxVectorTile |
一个 Leaflet 插件,在画布上渲染 Mapbox 矢量切片。仅兼容 Leaflet 0.7.x。 |
演示 | SpatialDev |
maplibre-gl-leaflet |
将 maplibre-gl-js 地图加载为 Leaflet 图层 |
MapLibre | |
Leaflet.VectorGrid |
在 Leaflet 1.0.0 中显示网格化矢量数据(使用 geojson-vt 切片的 GeoJSON 或 TopoJSON,或 protobuf 矢量切片)。 |
演示 | Iván Sánchez |
Leaflet.VectorTileLayer |
一个用于显示矢量切片的 Leaflet 图层。与 Leaflet.VectorGrid 非常类似,只是在样式方面有所不同:可以为所有图层指定一个样式,而 VectorGrid 需要提前知道图层名称。适用于 Leaflet 1.0.0。 |
Joachim Kuebart | |
leaflet-geojson-vt |
实时显示 GeoJSON 数据的矢量切片 |
演示 | Tek Kshetri |
protomaps-leaflet |
轻量级矢量地图渲染 + 标记和符号系统,适用于 Leaflet(支持 pmtiles 和 pbf 格式) |
演示 | Protomaps |
叠加数据
以下插件提供了加载叠加数据(GIS 矢量数据)的新方法:点、线和多边形。
叠加数据格式
从各种 GIS 格式加载您自己的数据。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.BetterFileLayer |
将空间化文件加载到 leaflet 中的决定性插件。 |
演示 | Gabriel Russo |
Leaflet.encoded |
在 Leaflet 中使用编码的折线。 |
Jieter | |
Leaflet.FileGDB |
将 ESRI 文件地理数据库作为图层放置到地图上。 |
Calvin Metcalf | |
Leaflet.FileLayer |
使用 HTML FileReader API(即本地,无服务器)将文件(GeoJSON、GPX、KML)加载到地图中。 |
Mathieu Leplatre | |
Leaflet.geoCSV |
Leaflet 插件,用于将 CSV 文件加载为 geoJSON 图层。 |
Iván Eixarch | |
Leaflet GPX |
GPX 图层,针对体育活动,提供距离、移动时间、配速、海拔、心率等信息的访问。 |
演示 | Maxime Petazzoni |
Leaflet LayerJSON |
将任何 JSON 数据源简单地转换为 Leaflet 图层,将 JSON 数据加载到图层中,并使用缓存系统最大限度地减少远程请求。 |
演示 | Stefano Cudini |
Leaflet.MultiMarkers |
一个 Leaflet 插件,用于显示大量高度可定制的标记,例如使用 Papa Parse 读取的 CSV 文件中的标记。 |
演示 | mfhsieh |
Leaflet.Shapefile |
将 shapefile 作为图层放置到地图上。 |
演示 | Calvin Metcalf |
Leaflet-BetterScale |
一个新的、更像 GIS 的比例尺,具有交替的黑/白条。 |
演示 | Dan Brown |
Leaflet-CsvTiles |
使用出色的 PapaParse 库加载来自切片 csv 文件的点。 |
演示 | Gherardo Varando |
Leaflet-GeoPackage |
加载 GeoPackage 切片和要素图层。 |
演示 | Daniel Barela |
leaflet-kml |
加载并显示 KML |
演示 | Windyx |
leaflet-omnivore |
为 Leaflet 加载并转换 CSV、KML、GPX、TopoJSON、WKT 格式。 |
演示 | Mapbox |
Leaflet-WFST |
WFS 客户端图层,支持事务 |
Flexberry | |
qgis2web |
一个 QGIS 插件,用于无需编码即可制作 web 地图。 |
Tom Chadwin | |
Wicket |
一个简单的库,用于在 Well-Known Text (WKT) 和 Leaflet 几何对象(例如,在 L.marker() 实例和“POINT()”字符串之间)之间进行转换。 |
演示 | K. Arthur Endsley |
动态/自定义数据加载
加载动态数据,该数据在映射中更新,或以非标准方式加载 GIS 矢量数据。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet Ajax |
通过 ajax 或 jsonp 添加 GeoJSON 数据。 |
Calvin Metcalf | |
Leaflet GeoSSE |
使用服务器发送事件将实时数据添加到 Leaflet 地图中。 |
An Tran | |
Leaflet.Indoor |
创建室内地图。 |
演示 | Christopher Baines |
Leaflet.Liveupdate |
定期(“实时”)更新地图上的某项内容。 |
演示 | Martijn Grendelman |
Leaflet.mytrack |
跟踪我在地图上的路线并将其下载。 |
演示 | DJ |
Leaflet.Pouch |
使用 PouchDB 将 CouchDB 数据同步到本地存储(indexedDB),以便仅添加 couchDB 数据,或作为 indexedDB 的更清晰的实现。 |
Calvin Metcalf | |
Leaflet Realtime |
在 Leaflet 地图上放置实时数据:实时跟踪 GPS 设备、传感器数据或几乎所有内容。 |
Per Liedman | |
Leaflet uGeoJSON |
通过 ajax post 请求添加自动更新的 GeoJSON 数据图层。 |
Benjamin VADANT |
合成叠加层
这些插件从头开始创建有用的叠加层,无需加载。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
L.OS.Graticule |
叠加英国测量局 (OS) 1 公里网格方块和标签。 |
Jon Shutt | |
Leaflet.AutoGraticule |
绘制纬度和经度线的网格,自动调整比例以适应当前缩放级别。 |
演示 | Candid Dauth |
Leaflet.EdgeScaleBar |
在 Web 墨卡托投影中,沿地图的顶部和右侧边缘创建比例尺。 |
Dražen Tutić, Ana Kuveždić Divjak | |
Leaflet.Graticule |
绘制纬度和经度线的网格。 |
Bjørn Sandvik | |
leaflet.latlng-graticule |
创建一个 Canvas 作为 ImageOverlay,绘制 Lat/Lon Graticule,并在地图边缘显示网格刻度标签。 |
演示 | CloudyBay |
Leaflet.Maidenhead |
对 Maidenhead 定位系统网格 的实现。 |
演示 | Iván Sánchez Ortega |
Leaflet.MetricGrid |
一个通用的公制网格叠加层,适用于 Leaflet,具有预定义的 UTM、英国和爱尔兰网格。 |
Bill Chadwick | |
Leaflet.PolarGraticule |
绘制投影感知的纬度和经度线网格,在这些线上带有标签,并可以选择设置线之间的范围和间隔。 |
演示 | Anton Steketee |
Leaflet.SimpleGraticule |
为 L.CRS.Simple 坐标系绘制网格线。 |
Andrew Blakey | |
Leaflet.Sun |
获取地图点击处的日落或日出时间。 |
演示 | DJ |
Leaflet.Terminator |
在地图上叠加白天和黑夜区域。 |
Jörg Dietrich | |
Leaflet.timezones |
在地球 Leaflet 地图上叠加时区。 |
演示 | DJ |
数据提供者
从第三方服务加载叠加数据。另请参见 底图提供者 和 插件集合。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.dbpediaLayer |
一个图层,包含来自维基百科的兴趣点 - 通过 ajax 从 DBpedia 的 SPARQL 端点加载。 |
Kr1 | |
Leaflet.FreieTonne |
一个叠加层,包含来自 FreieTonne 的航海要素。 |
演示 | Candid Dauth |
Leaflet.GeographPhotos |
使用 API 在交互式叠加层中显示来自英国和爱尔兰地理图的地理照片。 |
演示 | Barry Hunter |
leaflet.osmdatapicker |
在您绘制的区域中获取任何 OpenStreetMap (OSM) 数据的简单快捷方法。数据来自 overpass-turbo。 |
演示 | Amr Hamadeh |
Leaflet Overpass Layer |
轻松包含来自 overpass api 的数据。 |
演示 | Guillaume AMAT |
Leaflet.Rainviewer |
RainViewer 雷达数据 API 的插件。 |
演示 | Marcin Wasilewski |
Leaflet 矢量图层 |
允许轻松地从多个地理 web 服务创建矢量图层,例如 ArcGIS Server、Arc2Earth、GeoIQ、CartoDB 和 GIS Cloud。 |
Jason Sanford | |
leaflet-environmental-layers |
一系列不同的环境地图图层,包含在一个易于使用的 Leaflet 库中。 |
演示 | Public Lab |
leaflet-radar |
适用于 Leaflet 的动画卫星天气雷达叠加层。 |
演示 | rwev |
Leaflet-Wikipedia |
一个 Leaflet 插件,用于在图层上显示维基百科 API 条目。 |
演示 | Matthew Barker |
Windy-Leaflet-plugin |
使用 Windy 的免费 API 在您的页面上显示动画天气地图。 |
演示 | Windy.com |
叠加显示
以下插件提供了显示叠加数据信息的新方法。
标记和渲染器
这些插件提供了新的标记或将抽象数据转换为屏幕图像的新方法。精通 GIS 的 Leaflet 用户也知道这些是符号化器。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
L.Donut |
L.Circle 的扩展,允许定义外半径和内半径。 |
演示 | Falke-Design |
Leaflet.Arc |
此插件添加了 L.Polyline.Arc 函数,该函数包装了 arc.js 功能以创建大圆弧。 |
演示 | Alexey Gusev |
Leaflet.ArrowCircle |
一个 Marker 扩展,用于显示带有方向箭头。 |
演示 | R.A. Porter |
Leaflet.Awesome-Markers |
基于 Font Awesome 图标/Twitter Bootstrap 图标的多彩、标志性且视网膜级标记 |
演示 | Lennard Voogdt |
Leaflet.BeautifyMarkers |
轻量级插件,添加多彩的标志性标记,无需图像,并允许最终用户完全控制样式(即无限颜色和 CSS 样式)。 |
演示 | Muhammad Arslan Sajid |
Leaflet.bezier |
在两个点之间绘制一条贝塞尔曲线,并使用动画飞行对象。 |
演示 | Supun Praneeth |
Leaflet.BoatMarker |
使用 HTML Canvas 显示带航向和可选风信息的游艇和帆船的船舶标记。 |
演示 | Thomas Brüggemann |
Leaflet.Canvas-Markers |
在画布上而不是 DOM 上显示标记。 |
演示 | Evgeniy Voynov |
Leaflet.CenterMarker |
当通过拖动平移地图时,保持固定在地图中心的标记。可以在 What is my address? 上看到实际效果。 |
Jonatan Heyman | |
Leaflet.ColorIcon |
使用 CSS 过滤器覆盖图标的颜色,并使在不同颜色下添加相同的图标图像成为可能。 |
演示 | Maxence Martin (shevek) |
Leaflet.curve |
一个 Leaflet 插件,用于绘制贝塞尔曲线和其他复杂形状。 |
演示 | elfalem |
Leaflet.CustomLayer |
一个 Leaflet 插件 L.CustomLayer - 完全自定义的图层。 |
Derek Li | |
Leaflet.EdgeMarker |
插件用于指示当前视图之外存在要素。 |
演示 | Gerald Pape |
Leaflet.ellipse |
Leaflet.ellipse 通过指定中心点、长半轴、短半轴和相对于西方的倾斜度来在地图上放置椭圆形。 |
演示 | JD Fergason |
Leaflet.Extra-Markers |
无耻地复制 Awesome-Markers,包含更多形状、颜色和语义 UI 支持 |
演示 | Cory Silva |
Leaflet.Geodesic |
绘制大地线和圆圈。大地线是地球表面上两个给定点之间的最短路径。它使用 Vincenty 公式实现最高精度和距离计算。用 TypeScript 编写,并可通过 CDN 获取。 |
演示 | Henry Thasler |
Leaflet.geojsonCSS |
Geojson CSS 的 Leaflet 实现。 |
演示 | Alexander Burtsev |
Leaflet.GeotagPhoto |
用于照片地理标记的插件,具有两种模式:相机和十字线。 |
演示 | Bert Spaan |
Leaflet.GLMarkers |
使用自定义 WebGL 着色器显示数千个标记,可以选择动画。 |
演示 | Iván Sánchez Ortega |
Leaflet.greatCircle |
Leaflet.js Polygon 对象的包装类,绘制围绕地球的真实“大圆圈”(显示真实大地线、球面路径)。 |
演示 | Alex Wellerstein |
Leaflet.HighlightableLayers |
通过添加边框并将它们置于其他元素之上,突出显示 Leaflet 线和多边形。 添加透明边框可增加鼠标/触摸交互的容差。 |
演示 | Candid Dauth |
Leaflet.Icon.Glyph |
在您的标记中使用图标字体字形(来自 Font Awesome、Material Design Icons、Glyphicons、Metro UI 图标、Elusive 和其他图标字体)。 |
演示 | Iván Sánchez Ortega |
Leaflet.IconEx |
一个 Leaflet 插件,用于创建具有三个可自定义层的 DivIcon。 |
演示 | mfhsieh |
Leaflet.label |
将文本标签添加到地图标记和矢量图层。 |
Jacob Toye | |
Leaflet.LabelTextCollision |
在路径(折线、多边形、圆形)上显示标签,避免标签碰撞。 |
演示 | Kenta Hakoishi |
Leaflet.LineExtremities |
使用 SVG 标记在折线的末端显示符号。 |
演示 | Frédéric Bonifas |
Leaflet.magicMarker |
在加载时向标记添加神奇的动画效果。 |
Sylvenas | |
Leaflet.MakiMarkers |
使用来自 MapBox 的 Maki 图标 创建标记。 |
James Seppi | |
leaflet-mapwithlabels |
扩展 L.Map,实现自动标注。 如果存在 label 选项,则会对图层进行标注。 标签会动态泛化以避免重叠。 |
演示 | Mátyás Gede |
Leaflet.Marker.Highlight |
为 L.marker 添加突出显示性能。 |
演示 | Brandon Xiang |
Leaflet.Marker.Stack |
CartoDB 的“堆叠芯片”符号器的纯 Leaflet 实现。 |
演示 | Iván Sánchez |
Leaflet.orientedMarker |
允许动态管理标记的方向。 |
jekuno | |
Leaflet.ParallaxMarker |
添加在平移时相对于地图以视差效果移动的标记。 |
演示 | Dag Jomar Mersland |
Leaflet.pattern |
为路径添加对图案填充的支持。 |
Tyler Eastman | |
Leaflet.Photo |
在 Leaflet 地图上显示地理标记照片的插件。 |
演示 | Bjørn Sandvik |
Leaflet-polygon-fillPattern-canvas |
扩展多边形对象以使用图像图案填充画布元素。 性能优于 svg 渲染。 可以提高大数据的渲染性能。 |
bgx1012 | |
Leaflet.Polyline.Arrugator |
从源 CRS(坐标参考系统)重新投影折线,使其看起来像曲线。 旨在更好地显示任意 CRS 中栅格图像的边界框。 |
演示 | Iván Sánchez |
Leaflet Polyline Offset |
为 |
演示 | Benjamin Becquet |
Leaflet.PolylineDecorator |
允许您沿着折线或坐标路径绘制图案(如破折号、箭头或均匀间隔的标记)。 |
演示 | Benjamin Becquet |
Leaflet.RepeatedMarkers |
在绕地球旋转时显示标记,每 360 度经度一次。 |
演示 | Iván Sánchez |
Leaflet.River |
在地图上绘制不同宽度的线(如河流)。 当您想在地图上显示河流的“流动”方式时非常有用。 |
演示 | Grigory Golikov |
Leaflet Rotated Marker |
支持在 Leaflet 中旋转标记图标。 |
演示 | Benjamin Becquet |
Leaflet.RoughCanvas |
Leaflet.RoughCanvas 呈现手绘风格的矢量地图(折线、多边形、geojson)。 |
演示 | haoming |
Leaflet.SpeechBubble |
弹出一个带有箭头的语音气泡,该箭头跟随点、图层、标记等。 |
演示 | Sylvain BRISSY |
leaflet-spline |
基于 Leaflet.Curve 构建,leaflet-spline 基于一系列地理坐标绘制二次 贝塞尔样条曲线。 |
演示 | Seth Lutske |
Leaflet.Sprite |
在您的标记中使用基于精灵的图标。 |
Calvin Metcalf | |
Leaflet.StarCircle |
在 Leaflet 中绘制三角形、正方形、星形(n 角形)。 |
演示 | Haelue |
Leaflet.streetlabels |
一个 Leaflet 插件,用于显示沿着折线路径的标签。 yakitoritabetai Leaflet.LabelTextCollision 的扩展。 |
演示 | 3Maps |
Leaflet.SvgShapeMarkers |
添加对其他 SVG 标记类型(如三角形、菱形和正方形)的支持。 |
演示 | Rowan Winsemius |
Leaflet Swoopy |
用于创建可自定义的弯弯箭头注释的插件。 |
演示 | webkid |
Leaflet.TextPath |
允许您沿着折线绘制文本。 |
演示 | Mathieu Leplatre |
leaflet-tracksymbol2 |
用于在地图上显示航迹(三角形符号)和 AIS 联系人的插件。 这是的更新版本 |
演示 | ARL |
Leaflet Truesize |
用于创建投影感知可拖动多边形和折线的插件。 |
演示 | webkid |
Leaflet.VectorMarkers |
Leaflet 的矢量 SVG 标记,可以选择使用 Font Awesome/Twitter Bootstrap 图标。 |
Mathias Schneider | |
Leaflet.Viewpoint |
显示具有多个方向的圆形标记。 用于显示从一个点拍摄的照片。 |
演示 | Grigory Golikov |
leaflet-ais-tracksymbol |
leaflet-tracksymbol 的 AIS 扩展,用于在地图上显示 AIS 联系人。 |
Johannes Rudolph | |
leaflet-ais-tracksymbol-search |
为您的 Leaflet 地图和您的 leaflet-ais-trackymbol 添加搜索框。 |
Johannes Rudolph | |
Leaflet-arrowheads |
允许用户快速在折线上绘制箭头,以进行矢量可视化。 |
演示 | Slutske22 |
leaflet-choropleth |
扩展 L.geoJson 以添加色带可视化(基于值的色阶)。 |
演示 | Tim Wisniewski |
leaflet-corridor |
使用以米为单位而不是以像素为单位的固定宽度渲染折线。 根据缩放级别调整宽度。 |
演示 | Mikhail Shilkov |
leaflet-distance-markers |
允许在路线 (L.Polyline) 上以等效距离显示标记(例如,每英里一个)。 |
演示 | Doroszlai, Attila |
leaflet-icon-pulse |
使用 CSS 渲染脉动图标。 它可以用于位置标记。 |
演示 | mapshakers |
leaflet-labeled-circle |
一种特殊的 SVG 标记类型,在内部有一个标签,并且可以在锚点周围拖动。 |
演示 | Alexander Milevski |
leaflet-layervisibility |
扩展 L.Layer 和 L.LayerGroup,提供方法来隐藏/显示图层,而无需删除/重新添加它们。 |
演示 | Philipp Loose |
leaflet-mapkey-icon |
基于 mapkeyicons 的一组制图字体图标。 |
演示 | mapshakers |
leaflet-marker-direction |
显示标记的路径和方向。 |
演示 | Jack Zou |
leaflet-place-groups-picker |
用于 Leaflet 地图的插件,允许将位置分组到组中,这些组的可见性可以切换。 |
damianc | |
leaflet-polycolor |
为每条折线段着色。 |
演示 | Olivier Gasc |
leaflet-polygon.fillPattern |
扩展多边形对象以使用图像图案填充 SVG Path 元素。 |
演示 | CloudyBay |
Leaflet-semicircle |
为 |
Jieter | |
leaflet-simplestyle |
扩展 L.geoJSON 以支持 简单样式 规范。 |
演示 | Rowan Winsemius |
Leaflet-SVGIcon |
一个简单且可自定义的 SVG 图标,没有外部依赖关系。 还包括一个便利的 Marker 类和两个示例子类。 |
演示 | Ilya Atkin |
leaflet-usermarker |
用于在地图上绘制表示用户(或多个用户)的标记的插件,支持绘制精度圆。 在 Longitude.me 上可以查看实际效果。 |
Jonatan Heyman | |
OSM Buildings |
用于在 Leaflet 之上可视化 3D OSM 建筑几何体的惊人 JS 库。 |
演示 | Jan Marsch |
叠加动画
这些插件会为标记或一些几何图形添加动画。 另请参见 具有时间或海拔的几何图形。
聚类/整理
当您显示大量数据时,这些插件将使您的地图看起来更干净。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.ConditionalLayer |
FeatureGroup,它不会显示超过视窗中可见的特定数量的标记。 |
演示 | EPP |
Leaflet.Deflate |
当线和多边形的屏幕尺寸在较低的缩放级别变得太小时,将其缩减为标记。 |
Oliver Roick | |
Leaflet.DonutCluster |
一个轻量级独立的 Leaflet 插件,用于在使用 Leaflet 标记聚类 时在地图上显示圆环图,而不是圆形。 |
演示 | Kalisio 贡献者 |
Leaflet.FeatureGroup.SubGroup |
一个简单的插件,用于创建将子图层添加到父组中的 Feature Group。 典型的用法是通过 L.Control.Layers 将它们切换,以从 Leaflet.markercluster 动态添加/删除标记组。 |
演示 | ghybs |
Leaflet.GridCluster |
实时创建基于网格的聚类。 |
演示 | Andreas Kiefer |
Leaflet.inflatable-markers-group |
Leaflet 标记聚类插件的替代方案。 此插件为标记提供了两种状态:膨胀的、正常的、状态和收缩的状态,该状态显示的信息更少,占用的空间更小,用于整理地图。 |
演示 | Laurent Georget |
Leaflet.LayerGroup.Collision |
为标记组提供碰撞检测。 与聚类不同,它会考虑标记的形状和大小。 |
演示 | Iván Sánchez Ortega |
Leaflet.LayerGroup.Conditional |
根据任何条件控制组中要显示的图层。 例如,在低缩放级别上使用热图,在较高级别上使用标记。 |
演示 | Solfisk / Jørgen Elgaard Larsen |
Leaflet.markercluster |
美观、复杂、高性能的标记聚类解决方案,具有流畅的动画和许多很棒的功能。 推荐! |
演示 | Dave Leaver |
leaflet-tooltip-layout |
一个插件,用于避免工具提示重叠,并使查找每个工具提示和标记之间的关系变得更容易。 |
演示 | Zijing Peng |
Overlapping Marker Spiderfier |
以 Google Earth 风格的方式处理重叠标记,在点击时优雅地将它们分开。 |
演示 | George MacKerron |
PruneCluster |
快速且实时的标记聚类库。 |
演示 | Antoine Pultier |
q-cluster |
具有 D3 分类功能的快速点聚类库。 |
演示 | Nicholas Hallahan |
热力图
这些插件使用矢量数据创建热图和类似热图的可视化效果。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
HeatCanvas |
基于 HTML canvas 的简单热力图 API。 |
演示 | 孙宁 |
heatmap.js |
基于 HTML canvas 的热力图 JavaScript 库。它的 Leaflet 图层实现支持大型数据集,因为它基于瓦片并且使用四叉树索引来存储数据。 |
演示 | Patrick Wied |
Leaflet divHeatmap |
基于 CSS 和 divIcons 的轻量级且通用的热力图层。 |
Daniele Piccone | |
Leaflet.heat |
一个微小、简单且快速的 Leaflet 热力图插件。在幕后使用 simpleheat,另外将点聚集成网格以提高性能。 |
演示 | Vladimir Agafonkin |
Leaflet.SmoothPolygons |
在幕后使用 paperJS 在画布上绘制路径。 |
演示 | Sanchez Weezer |
Leaflet-Solr-Heatmap |
一个 Leaflet 插件,用于从 Solr 的热力图分面 渲染热力图和聚类。对于数百万个点或多边形,性能很高。 |
Jack Reed | |
MaskCanvas |
可以用于可视化覆盖范围的画布层。 |
演示 | Dominik Moritz |
WebGL Heatmap |
使用 WebGL 的高性能 Javascript 热力图插件。 |
演示 | Benjamin J DeLong |
数据可视化
用于数据可视化的强大多用途库。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
geogrid.js |
显示按 ISEA3H 离散全球网格系统聚合的数据。例如,可以使用 Measures REST(一个用于传递按网格聚合的数据的框架)或 geogrid(一个用于处理网格的库,如果您要手动聚合数据)。 |
F.-B. Mocnik, | |
jquery-storymap |
一个 jQuery 插件,用于在用户滚动浏览段落时显示多个地图位置。 |
演示 | Atle Frenvik Sveen |
Leaflet.Canvas-Flowmap-Layer |
一个 LeafletJS 自定义地图层,用于使用在 HTML canvas 上渲染的贝塞尔曲线来映射对象、想法、人员等的流动。 |
演示 | Jacob Wasilkowski |
Leaflet.D3SvgOverlay |
用于与 D3 库一起使用的 SVG 覆盖层类。支持缩放动画和缩放,无需重新绘制图层。 |
演示 | Kirill Zhuravlev |
Leaflet 数据可视化框架 |
用于轻松进行主题映射和数据可视化的新标记、图层和实用程序类。 |
Scott Fairgrieve | |
leaflet-dataclassification |
用于 GeoJSON 数据驱动的主题地图的单步数据分类、符号和图例创建。 |
演示 | Dániel Balla |
Leaflet for R |
允许从 R 程序(一种流行于统计分析和数据挖掘的编程语言)中使用 Leaflet。 |
演示 | RStudio 团队 |
Leaflet.Gleo |
将 Gleo 渲染器嵌入为 Leaflet 图层。Gleo 是一个通用的面向对象的 WebGL 制图渲染库。 |
演示 | Iván Sánchez Ortega |
Leaflet.glify.layer |
Leaflet.glify 插件的附加组件,提供更多 Leaflet 风格的绑定。为 GeoJSON FeatureCollections 提供快速 webgl 渲染(目前仅限于多边形、线条和点)。 |
演示 | onaci |
Leaflet.glify |
使用 WebGL 为大型 (+100MB) GeoJSON 数据集提供快速渲染。 |
演示 | robertleeplummerjr |
antv/l7-leaflet |
使用 L7 大规模基于 WebGL 的地理空间数据可视化分析引擎,增强 Leaflet 大规模地理空间数据可视化。 |
演示 | lzxue |
leaflet.migration |
此插件为 Leaflet 添加图层,显示迁移、飞行线。用户可以自定义标记、线条、弹出窗口等。 |
演示 | Kakaka Hou |
leaflet.migrationLayer |
leaflet.migrationLayer 用于显示人口、航班、车辆、交通等迁移数据。地图上的数据可视化。 |
演示 | Sylvenas |
Leaflet.PixiOverlay |
用于使用 Pixi.js 绘制和动画的 Leaflet 覆盖层类。 |
演示 | Manuel Baclet |
Leaflet.Quadtree |
Leaflet.Quadtree 用于检索给定边界内的可见数据。 |
演示 | ibesora |
leaflet-echarts |
一个用于 Leaflet 的插件,用于加载 echarts 地图,使大数据可视化更轻松。 |
演示 | wandergis |
leaflet-partition |
以不同的方式将区域划分为部分,例如沃罗诺伊(三角剖分)和六边形平铺。 |
演示 | locknono |
leaflet-velocity |
使用 Leaflet 可视化速度层。 |
演示 | Dan Wild |
mapbox-gl-leaflet |
从 Mapbox GL JS 到 Leaflet API 的绑定。 |
演示 | Tom MacWright |
Mapstats |
一个 Leaflet 插件,用于在地图上显示和监控(无线)网络。 |
演示 | Jirka Klír |
RaphaelLayer |
允许您将 Raphael 用作 Leaflet 地图上的一个图层,以实现高级动画和可视化效果。 |
动态方法 |
与几何图形/要素的交互
以下插件使用户能够与覆盖数据交互:编辑几何图形、选择区域或要素、与时间维度交互、搜索要素并显示有关要素的信息。
编辑几何
允许用户创建、绘制、编辑和/或删除点、线和多边形。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet-Geoman |
Leaflet 1.0 及更高版本的几何图形管理。绘制、编辑、拖动、切割、旋转、拆分、缩放、测量、捕捉和固定图层,如标记、圆形标记、折线、多边形、圆形、矩形、图像覆盖、图层组、GeoJSON、多线字符串和多边形。支持多边形中的孔、画布模式等。 |
演示 | Sumit Kumar |
Leaflet.Clipper |
允许对两个多边形执行联合、差集、异或和交集运算。 |
演示 | will Farrell |
L.Control.PaintPolygon |
使用类似 Paint[brush] 的圆形画笔绘制多边形。包含 turf.js 依赖项。 |
Thibault Coupin | |
Leaflet.DraggableLines |
通过拖放添加/移动/删除路线、线条和多边形上的点。 |
演示 | Candid Dauth |
Leaflet.draw.svg |
Leaflet.Draw 的插件,允许在 Leaflet 地图上添加/移动/删除自定义 SVG 文件。它允许将 SVG 定义为 XML 文本,并将其转换为可以由 Leaflet 作为可编辑要素显示的 SVG 对象。 |
演示 | Robin Massink |
Leaflet.draw |
通过非常人性化的界面(带有图标和提示)启用绘制折线、多边形、矩形、圆形和标记等要素。 |
Jacob Toye | |
Leaflet.Editable.Polyline |
可编辑的折线:移动现有点、添加新点和拆分折线。 |
演示 | Tomo Krajina |
Leaflet.Editable |
轻量级、完全可定制和可控制的绘制/编辑插件。 |
演示 | Yohan Boniface |
Leaflet.EditableHandlers |
一组插件,包括圆形编辑、测量工具和多边形边的标签。 |
Kartena | |
Leaflet.FreeDraw |
受 Zoopla 启发的使用 Leaflet.js 和 D3 的徒手多边形创建。 |
演示 | Wildhoney |
Leaflet.Illustrate |
Leaflet.draw 的扩展,使用户能够直接在地图上键入注释。 |
演示 | Justin Manley |
Leaflet.MapPaint |
专为触摸设备设计的位图绘画插件。 |
演示 | Antoine Pultier |
Leaflet.Path.Drag |
多边形和折线的拖动处理程序和交互。 |
演示 | Alexander Milevski |
Leaflet.Path.Transform |
多边形和折线的缩放和旋转处理程序和交互。 |
演示 | Alexander Milevski |
Leaflet.Pather |
L.Pather 是一个徒手折线创建器,它简化了折线以实现可变性。需要 D3 支持。 |
演示 | Wildhoney |
Leaflet.Pin |
在使用 Leaflet.Draw 绘制或编辑要素时,启用将标记附加到其他图层。 |
演示 | Konrad Klimczak |
Leaflet.plotter |
leaflet-plotter 允许您使用 Leaflet 支持的地图创建路线。您可以单击中点以创建一个新的可拖动点。 |
演示 | Nathan Mahdavi |
Leaflet.SegmentEdit |
Leaflet.draw 的扩展,允许一次编辑大型折线的一部分。 |
演示 | Lemaf |
Leaflet.SimpleMarkers |
一个轻量级的 Leaflet 插件,用于添加和删除标记。 |
Jared Dominguez | |
Leaflet.Snap |
启用可拖动标记对折线和其他图层的捕捉。 |
演示 | Mathieu Leplatre |
Leaflet.Storage |
创建/更新/删除地图、标记、多边形、折线……并使用 API 将它们公开以进行后端存储。 |
Yohan Boniface | |
Leaflet.StyleEditor |
使用 GUI 启用编辑要素(线、多边形等)和标记的样式。 |
演示 | Dennis Wilhelm |
Leaflet.trace |
扩展 Leaflet.draw 以添加一组新工具,允许用户选择要跟踪的 L.geoJSON 线或捕捉到其上的标记。 |
演示 | Alex Gilvarry |
Leaflet-Craft |
扩展 Leaflet.FreeDraw 并提供扩展功能,如撤消重做、删除标记、多边形的动态区域计算、各种钩子/事件和内置控制栏等。 |
演示 | Sagarpreet Chadha |
Terra Draw |
Terra Draw 的 TerraDrawLeafletAdapter 允许用户在 Leaflet 地图上创建、选择和编辑各种几何图形类型(点、线多边形等)。 |
演示 | James Milner |
时间和海拔
大多数数据是二维的(纬度和经度),但有些数据具有更多维度(高度和/或时间)。以下插件帮助用户浏览这些额外的维度。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
LeafletSlider-LocalTimeV2 |
LeafletSlider-LocalTimeV2 使您能够在地图上动态添加和删除标记(无延迟),并使用 JQuery UI 滑块显示本地时间的日期范围。 |
演示 | Carlos Charletti |
leaflet-calendar |
leaflet-calendar 允许您添加一个日历选择器,并在选择日期时触发自定义函数。 |
演示 | Antonio Vida |
Leaflet.Elevation |
一个 Leaflet 插件,用于使用 d3 查看 GeoJSON 线的交互式高度剖面。 |
演示 | Felix Bache |
Leaflet.Heightgraph |
受 Leaflet.Elevation 启发,这个 Leaflet 插件允许您查看存储为 GeoJSON 的交互式高度剖面,具有方便的功能,可以使用存储在 GeoJSON 本身中的属性以自定义颜色可视化任意段(例如,表面类型或陡峭度类别)。 |
演示 | Robin Boldt |
Leaflet Hex Time Slider |
使用 leaflet + d3.js 和 nouislider 的最小化时间滑块,用于使用 geoJSON 文件显示时间序列数据。 |
演示 | Albert Kochaphum |
Leaflet.hotline |
一个 Leaflet 插件,用于沿着折线绘制渐变。 |
演示 | iosphere |
Leaflet.TimeDimension |
在 Leaflet 地图上添加时间维度功能。 |
演示 | ICTS SOCIB |
Leaflet Timeline Control |
无主见的 timeline 控制,帮助您显示时间序列数据。 |
演示 | Michal Zimmermann |
Leaflet.timeline |
使用时间轴滑块和播放按钮在地图上显示任意 GeoJSON。 |
演示 | Jonathan Skeate |
Leaflet.timelineSlider |
一个 Leaflet 插件,可以创建具有用户设计功能的可定制时间轴滑块。 |
演示 | Sol Vitkin |
Leaflet Time-Slider |
Leaflet Time-Slider 使您能够使用 JQuery UI 滑块动态添加和删除地图上的标记。 |
演示 | Dennis Wilhelm |
Leaflet Topography |
一组用于以闪电般的速度计算和可视化地形数据(高程、坡度、坡向)的工具。基于 Mapbox RGB 编码 DEM 瓦片。 |
演示 | Seth Lutske |
leaflet.TrackPlayBack |
一个 Leaflet 轨道回放插件,可以显示和动态播放轨道。 |
演示 | linghuam |
LeafletPlayback |
回放与时钟同步的时间戳 GPS 轨道。 |
演示 | Nicholas Hallahan |
搜索和弹出框
搜索覆盖层并增强显示有关覆盖层信息的插件。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
L.tagFilterButton |
通过标签对 LeafLet 标记进行过滤 |
演示 | Mehmet Aydemir |
Leaflet.AnimatedSearchBox |
一个简单的 Leaflet 插件,提供一个可折叠搜索框。 |
演示 | Luka Steinbach |
Leaflet.GeoJSONAutocomplete |
Leaflet 用于使用 GeoJSON 服务进行远程搜索的自动完成功能。 |
演示 | Yunus Emre Özkaya |
Leaflet PinSearch |
一个 Leaflet 插件,用于提供一个可配置的搜索栏组件,该组件对地图上所有现有的 pin 进行自动完成功能。 |
演示 | Ahmad El Mokahal |
Leaflet.PopupMovable |
此插件使 L.Popup 可以通过用户拖动移动,并自动绘制引导线。 |
演示 | Yasuhiro Suzuki |
Leaflet.RevealOSM |
非常简单但可扩展的 Leaflet 插件,用于在点击地图时显示 OSM POI 数据。 |
Yohan Boniface | |
Leaflet.Rrose |
一个用于边缘情况的 Leaflet 插件。当您希望弹出窗口在鼠标悬停时出现,而不是在点击时出现,并且您需要弹出窗口提示在您靠近地图边缘时重新定向时使用。 |
演示 | Eric Theise |
Leaflet Search |
一个用于通过图层组/GeoJSON 中的自定义属性搜索标记/要素位置的控件。支持 AJAX/JSONP、自动完成功能和第三方服务。 |
演示 | Stefano Cudini |
Leaflet Underneath |
使用 Mapbox 矢量瓦片数据查找某个位置附近的有趣要素,以快速、带宽有限的方式向瓦片层添加交互式功能。 |
Per Liedman | |
Leaflet.utfgrid |
为 Leaflet 提供一个 utfgrid 交互处理程序,占地面积很小。支持 Leaflet >= 1.0。包括基本的鼠标悬停支持,以及在悬停时突出显示来自 UTFGrid 的要素的功能。 |
Dave Leaver | |
leaflet-custom-searchbox |
一个类似 Google 地图的搜索框,包含一个侧面板滑块控制。 |
演示 | 公元 |
leaflet-fusesearch |
一个控件,提供一个面板,使用轻量级模糊搜索 Fuse.js 在 GeoJSON 层中搜索要素。 |
演示 | Antoine Riche |
Leaflet-gplaces-autocomplete |
在地图中添加 Google Places 搜索。 |
Michal Haták | |
leaflet-popup-modifier |
允许用户编辑弹出窗口的内容,或使用弹出窗口移除其源标记。 |
Slutske22 | |
leaflet-responsive-popup |
无需移动地图即可查看弹出窗口的内容。 |
演示 | YaFred |
区域/叠加选择
这些插件帮助用户在地图中选择叠加层或区域。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet-Area-Selection |
leaflet-area-selection 允许在地图上轻松选择多边形区域。 |
演示 | B-Open |
L.Control.LineStringSelect |
快速 LineString(折线)部分选择工具:在复杂路径中选择两个点之间的延伸部分。 |
演示 | Alexander Milevski |
Leaflet.AreaSelect |
一个固定位置、可调整大小的矩形,用于在地图上选择区域。 |
演示 | Jonatan Heyman |
Leaflet.CheapLayerAt |
允许查询屏幕坐标下的层。 |
演示 | Iván Sánchez Ortega |
Leaflet.FeatureSelect |
使用可配置的中心点标记从 GeoJSON 层中选择任何几何类型。 |
演示 | Aaron Ogle |
Leaflet GeoJSON Selector |
Leaflet 控件,用于从交互式列表和地图中的 GeoJSON 特征中进行选择。 |
演示 | Stefano Cudini |
Leaflet.SelectAreaFeature |
通过绘制区域选择地图上的要素层。 |
演示 | Sandro Pibia |
leaflet-lasso |
套索选择插件。 |
演示 | Jan Zak |
Leaflet-Select-Polygons |
Leaflet-Select-Polygons 允许选择多个多边形,并调整底图视图。 |
演示 | Erick S Escalante Olano |
Leaflet-Shades |
一个可拖动、可调整大小的矩形,用于在地图上选择区域并在未选区域创建灰色覆盖层。 |
演示 | Mandy Kong |
地图交互
与地图本身交互的新方法。
图层切换控件
以下插件增强或扩展了 L.Control.Layers
。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
L.switchBasemap |
一个简单的 Leaflet 插件,用于切换底图。 |
演示 | clavijojuan |
Leaflet.ActiveLayers |
添加新的 L.Control.ActiveLayers,具有获取地图上当前活动层的功能。 |
vogdb | |
Leaflet.AutoLayers |
自动从多个地图服务器拉取图层,并使用用户控制的覆盖层 zIndex 管理来组织/搜索它们。 |
Alex Ebadirad | |
Leaflet.Basemaps |
一个底图选择器,带有来自瓦片堆栈的预览图像。 示例 |
演示 | Brendan Ward |
Leaflet Categorized Layers |
扩展的 Leaflet 控制层,用于分类层组。 |
Robbie Trencheny | |
Leaflet.Control.Appearance |
Control.Layers 的扩展,可以控制图层的显示方式 - 颜色、透明度,并可以移除覆盖层。 |
Kanahiro Iguchi | |
Leaflet.Control.Layers.Tree |
L.Control.Layers 扩展,支持树结构,适用于基础层和覆盖层。简单且高度可配置。 |
演示 | Javier Jimenez Shaw |
Leaflet Control Order Layers |
添加了在图层控制中更改覆盖层顺序的功能。 |
Michael Salgado | |
Leaflet.GroupedLayerControl |
Leaflet 图层控制,支持将覆盖层分组在一起。 |
演示 | Ishmael Smyrnow |
Leaflet.LayerTreeControl |
一个 Leaflet 插件,用于将多种类型的图层分组到树结构中。 |
演示 | Ignacio Fagian |
Leaflet.LayerTreePlugin |
Leaflet 控件允许打开和关闭图层,以树状方式显示它们。 |
演示 | Alexander Arakelyan |
Leaflet Panel Layers |
扩展的 Leaflet 控制层,用于图层组和图标图例。 |
Stefano Cudini | |
Leaflet.SelectLayers |
一个 Leaflet 插件,添加新的控件以在地图上切换不同的图层。新的控件用选择标签替换 L.Control.Layers 单选按钮面板。 |
vogdb | |
Leaflet.StyledLayerControl |
一个 Leaflet 插件,通过将图层组织到类别或组中来实现图层的管理和控制。 |
演示 | Davi Custodio |
Leaflet.UniformControl |
Leaflet 图层控制,带有可样式化的复选框和单选按钮。 |
演示 | Chris Calip |
Leaflet-IconLayers |
Leaflet 控件,将底图显示为小图标。 |
演示 | Alexander Zverev |
交互式平移/缩放
更改用户交互式在地图上移动的方式。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.SyncView |
用于 Leaflet 的同步视图控件。专为 Drupal Leaflet 模块 集成而设计。 |
演示 | Wong Hoi Sing Edison |
L.Control.ZoomBar |
Leaflet 原生缩放控件的扩展版本,带有主页和缩放至区域按钮。 |
演示 | Elijah Robison |
Leaflet.BorderPan |
一个 Leaflet 插件,通过单击地图边框进行平移。 |
Sebastián Lara | |
Leaflet.BoxZoom |
一个可见的、可点击的控件,用于执行框缩放。 |
演示 | Greg Allensworth |
Leaflet.DoubleRightClickZoom |
交互处理程序,使用双击右键启用缩小。 |
演示 | Mike O'Toole |
Leaflet.DoubleTouchDragZoom |
用于单指缩放的插件。 |
演示 | Peter C |
Leaflet GameController |
交互处理程序,提供对游戏手柄的支持。 |
Antoine Pultier | |
Leaflet LimitZoom |
插件,将可用缩放级别限制到给定列表,方法是限制缩放或插值瓦片。 |
演示 | Ilya Zverev |
Leaflet.Pancontrol |
一个简单的平移控件。 |
Kartena | |
Leaflet.twofingerZoom |
用于触摸设备的交互处理程序,使用双指轻触启用缩小。 |
Adam Ratcliffe | |
Leaflet.ZoomBox |
一个轻量级的缩放框控件:在要缩放的区域周围绘制一个框。 |
演示 | Brendan Ward |
Leaflet.ZoomEx |
一个 Leaflet 插件,在地图上显示缩放控件,使用 CSS 自定义外观和位置。 |
演示 | mfhsieh |
Leaflet.zoominfo |
一个显示当前缩放级别的缩放控件。 |
演示 | Flávio Carmo |
Leaflet.ZoomLabel |
一个简单的缩放标签控件。 |
演示 | Masashi Takeshita |
Leaflet.ZoomPanel |
Leaflet 的缩放控制面板。 |
演示 | Shuhua Huang |
Leaflet.zoomslider |
一个缩放滑块控件。 |
演示 | Kartena |
书签平移/缩放
通过跳转到预定义/存储的位置,更改用户在地图上移动的方式。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.ResetView |
用于 Leaflet 的重置视图控件。专为 Drupal Leaflet 模块 集成而设计。 |
演示 | Wong Hoi Sing Edison |
Leaflet.Bookmarks |
控件,用于在地图上添加和浏览用户创建的书签。 |
演示 | Alexander Milevski |
Leaflet.defaultextent |
一个控件,返回地图的原始起始范围。类似于 HomeButton 小部件。 |
Alex Nguyen | |
Leaflet Locationlist |
一个控件,用于在预定义的位置和缩放之间跳转。 |
Ivan Ignatyev | |
Leaflet Navigation Toolbar |
Leaflet 控件,用于简单的后退、前进和主页导航。 |
演示 | David C |
Leaflet.RestoreView |
使用 localStorage 存储和恢复地图视图。 |
演示 | Mathieu Leplatre |
Leaflet.ShowAll |
一个控件,可以显示预定义的范围,同时保存当前范围,以便可以跳回到该范围。 |
演示 | Mor Yariv |
Leaflet.viewcenter |
一个简单的控件,添加一个按钮来更改视图和缩放至选项中预定义的值。 |
演示 | Dariusz Pawlak |
Leaflet.zoomhome |
具有主页按钮的缩放控件,用于重置视图。 |
演示 | Florian Brucker |
leaflet-hash |
插件,用于通过 URL 哈希持久保存地图状态和浏览历史记录。 |
演示 | Michael Lawrence Evans |
Leaflet-History |
跟踪地图移动和缩放位置的历史记录,类似于浏览器。 |
演示 | Chris Scott |
leaflet-view-meta |
插件控件,显示和持久保存地图视图元数据、中心和边界坐标到 URL,以便精确共享和视图重建。 |
演示 | rwev |
leaflet-zoom-min |
在缩放控件中添加一个按钮,允许您通过单击一次将地图缩放至最小缩放级别。 |
Alan Shaw |
全屏控件
允许以全屏模式显示地图。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
leaflet.fullscreen |
另一个全屏按钮控件,但用于现代浏览器,使用 HTML 全屏 API。 |
演示 | Bruno B |
Leaflet.fullscreen |
使用全屏 API 的全屏按钮控件。 |
演示 | jfirebaugh |
leaflet.zoomfs |
一个全屏按钮控件。 |
Eli Dupuis |
小地图和同步地图
同时显示两张地图。其中一张可能是不同的尺寸和缩放级别,可用作小地图,帮助导航。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
leaflet.WorldMiniMap |
一个小型小地图,显示世界小地图上的地图视图,以帮助导航。 |
演示 | M. Friedl |
Leaflet.GlobeMiniMap |
简单的迷你地图控件,将 3D 地球放置在地图的角落,以与主地图相同的位置为中心。 |
演示 | Chris Whong |
Leaflet.layerscontrol-minimap |
使用同步小地图扩展默认 Leaflet 图层控件。 |
Jieter | |
Leaflet.MagnifyingGlass |
允许您以不同的缩放级别显示地图的一小部分,无论是在固定位置还是与鼠标移动相关联,从而实现放大镜效果。 |
Benjamin Becquet | |
Leaflet.MiniMap |
一个小型小地图,以不同的比例显示地图,以帮助导航。 |
演示 | Robert Nordan |
Leaflet.Sync |
两张地图的同步视图。 |
演示 | Bjørn Sandvik |
leaflet-clonelayer |
克隆 Leaflet 图层以允许在同一运行时跨不同地图重复使用。 |
Jieter |
测量
允许用户测量距离或面积。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.LinearMeasurement |
Leaflet 线性测量插件,用于创建具有沿路径增量测量的折线。 |
演示 | New Light Technologies |
Leaflet Measure Path |
在路径上显示测量值;目前支持折线、多边形和圆形。 |
演示 | Per Liedman |
Leaflet.MeasurePolygon |
MeasurePolygon 允许您在绘制时计算多边形的面积和周长,非常明显且直观。 |
演示 | Erick S. Escalante Olano |
Leaflet.MeasureAreaControl |
测量元素面积的控件。 |
演示 | Ondrej Zvara |
Leaflet.MeasureControl |
在地图上测量距离的简单工具(*依赖于 Leaflet.Draw*)。 |
演示 | Makina Corpus |
Leaflet.nauticscale |
在地图上显示航海比例尺。 |
Johannes Rudolph | |
Leaflet.PolylineMeasure |
测量简单线以及复杂折线的测地线距离。 |
演示 | PPete |
Leaflet.QgsMeasure |
Leaflet 控件,用于像 Qgis 标尺一样在地图上测量线段距离。 |
演示 | Gabriel Russo |
Leaflet.ScaleFactor |
在地图上显示比例尺因子(例如 1:50,000)。 |
演示 | Marc Chasse |
leaflet-graphicscale |
可配置的动画图形比例尺控件。 |
演示 | Kalisio 贡献者,Erik Escoffier |
leaflet-measure |
用于 Leaflet 地图的坐标、线性和平面测量控件。 |
LJA GIS | |
leaflet-reticle |
Leaflet 控件,添加一个由独立计算的纬度和经度比例尺组成的居中十字线。 |
演示 | rwev |
leaflet-ruler |
一个简单的 Leaflet 插件,用于测量点击点的真方位角和距离。 |
演示 | Goker Tanrisever |
鼠标坐标
以不同的方式显示鼠标光标下的地理坐标。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet Coordinates Control |
捕捉鼠标点击,并显示其坐标,并提供方便的复制方法。 |
演示 | Michal Zimmermann |
Leaflet.Coordinates |
一个简单的 Leaflet 插件,查看鼠标 LatLng 坐标。还根据用户输入查看带有坐标弹出窗口的标记。 |
演示 | Felix Bache |
Leaflet.CoordProjection |
在鼠标移动时显示坐标,并根据给定的投影显示坐标。 |
演示 | Edi Hasaj |
Leaflet Copy Coordinates Control |
与 Leaflet 配合使用,捕获地图上的鼠标点击,并显示关联的坐标,并提供方便的复制方法。(源自 zimmicz 的原始作品。主要为了提供 npm 功能而分叉。) |
演示 | Chaim Krause |
Leaflet Location Picker |
带有小型 Leaflet 地图的简单位置选择器。 |
演示 | Stefano Cudini |
Leaflet.MapCenterCoord |
一个 Leaflet 控件,用于显示地图中心的坐标,尤其适用于触摸/移动设备。 |
演示 | Xisco Guaita |
Leaflet.Mapcodes |
显示鼠标指针的 Mapcode,在鼠标移动时显示。 |
演示 | Martin Atukunda |
Leaflet.mouseCoordinates |
在框中显示鼠标坐标。支持多种格式:GPS、UTM、UTMREF/MGRS、QTH |
Johannes Rudolph | |
Leaflet.MousePosition.ts |
一个用 TypeScript 编写的完全可自定义的坐标查看器。您可以使用 JSX 创建自定义组件来更改此插件的外观。 |
演示 | 鸟山勇树 |
Leaflet.MousePosition |
一个简单的 MousePosition 控件,用于显示鼠标指针的地理坐标,随着鼠标在地图上移动而显示。 |
阿尔迪·卢基安托 | |
Leaflet.NACCoordinates |
显示鼠标移动时鼠标指针的 NAC 坐标。 |
马哈茂德·德赫甘 |
事件
这些插件扩展了 Leaflet 的事件处理。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
L.DraggableEnhancer |
修改默认的 L.Draggable 处理程序(负责地图平移等),使其在其中一个地图容器的父元素具有预定义的处理程序(例如,"event.stopPropagation()" 附加到 "mousemove" 事件)的情况下正常工作。 |
文森特·德尚东 | |
L.Sleep |
避免不必要的滚动捕获。 |
演示 | atstp |
L.Spotlight |
使用可自定义的形状动态突出显示鼠标光标附近的要素。 |
艾萨克·博茨 | |
Leaflet.AlmostOver |
当光标“几乎”位于图层上时触发鼠标事件。 |
演示 | Mathieu Leplatre |
Leaflet.ClickTolerance |
此插件允许您增加由画布驱动的图层的点击容差,从而可以将矢量图层的可点击区域增加到其可见范围之外。当您的要素难以点击时很有用。 |
吉奥洛普 | |
Leaflet.ControlledBounds |
受 Leaflet-active-area 启发,自动检测地图中未被任何地图控件覆盖的最大区域,并将 setView、fitBounds、setZoom、getBounds 应用于该区域。 |
Iván Sánchez Ortega | |
Leaflet.Freezy |
使用悬停激活或点击激活来避免不必要的滚动捕获。 |
演示 | 马丁·鲁布利 |
Leaflet.GestureHandling |
将 Google 地图手势处理的基本功能带入 Leaflet。防止用户在滚动长页面时陷入地图。 |
演示 | 安迪·马奎斯 |
Leaflet.OverIntent |
添加一个新的事件 |
演示 | Mathieu Leplatre |
Leaflet 触摸帮助程序 |
通过添加一个透明的、更大的触摸表面,使在小型显示屏上用粗手指触摸矢量叠加层变得容易。 |
演示 | Per Liedman |
Leaflet.VisualClick |
当用户点击/点击地图时添加视觉反馈。当服务器请求或 Leaflet.singleclick 的实现延迟进一步操作时很有用。仅在 Leaflet 1.0.0-beta1 上测试。 |
演示 | Dag Jomar Mersland |
Leaflet-active-area |
此插件允许您使用地图的较小部分作为活动区域。所有定位方法(setView、fitBounds、setZoom)都将应用于此部分,而不是整个地图。 |
演示 | 马皮 |
singleclick |
扩展 |
演示 | Iván Sánchez Ortega |
用户界面
按钮、滑块、工具栏、侧边栏和面板。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
leaflet-multicontrol |
Leaflet 插件,用于实现具有多种功能的图层控件,例如不透明度、颜色、bringToFront、bringToBack、zoomToLayer、删除和图例。 |
演示 | 胡安·卡米洛·克拉维霍·桑多瓦尔 |
L.cascadeButtons |
一个 Leaflet 插件,用于创建级联按钮。 |
演示 | clavijojuan |
L.Credits |
一个简单、有吸引力、交互式的控件,用于将您的徽标和链接放在地图的角落。 |
演示 | Greg Allensworth |
L.EasyButton |
在一行中,添加一个带有附加点击事件的 Font Awesome 控件按钮。 |
演示 | atstp |
Leaflet.BootstrapDropdowns |
一个 Leaflet 插件,用于显示 bootstrap 下拉菜单。 |
演示 | mfhsieh |
Leaflet.BootstrapZoom |
使用 Twitter Bootstrap 风格的按钮覆盖默认的缩放控件按钮。 |
演示 | Alexey Gusev |
Leaflet.CondensedAttribution |
一个归属插件,使长属性在悬停时可见。 |
演示 | 塔尔戈莫有限公司 |
Leaflet.contextmenu |
一个用于 Leaflet 的上下文菜单。 |
演示 | Adam Ratcliffe |
Leaflet.Control.Custom |
具有 HTML 元素的完全可自定义的 Leaflet 控件面板。 |
演示 | 伊吉特·尤塞 |
Leaflet.Control.Resizer |
用于在右侧或底部调整地图大小的控件。 |
演示 | Javier Jimenez Shaw |
Leaflet.Control.Select |
可自定义的菜单式控件。 |
演示 | 亚当·梅特尔 |
Leaflet.CoordinatedImagePreview |
在地图边界内显示协调的图像。 |
演示 | Yunus Emre Özkaya |
Leaflet.CountrySelect |
带所有国家菜单的控件,以及一个事件监听器,将所选国家作为 GeoJSON 特征返回。 |
演示 | 阿尼卡·哈洛塔 |
Leaflet.Dialog |
一个简单的可调整大小、可移动、可自定义的对话框。 |
演示 | NBT 解决方案 |
Leaflet.GeojsonLayerSwitcher |
允许在 GeoJSON 图层之间导航,选择一些图层,并返回选择。 |
演示 | 轻松山脉 |
Leaflet.HtmlLegend |
一个简单的 Leaflet 插件,用于使用 HTML 元素创建图例。 |
演示 | 卡维赫·卡里米 |
Leaflet.Legend |
显示图例符号并切换叠加层。 |
演示 | 金建军 |
Leaflet.Messagebox |
在地图上显示临时文本消息。 |
演示 | Martijn Grendelman |
Leaflet.Notifications |
在地图内生成吐司通知。 |
演示 | 曼努埃尔·里希特 |
Leaflet ResizableControl |
一个 Leaflet 插件,用于在地图上添加可调整大小且可滚动的控件。 |
演示 | 大卫·阿尔布雷希特 |
leaflet-sidepanel |
带选项卡的侧边栏。保持简短并查看 插件指南。 |
演示 | 麦克斯韦尔·伊莱 |
Leaflet.Signposts |
使用方向箭头和每个给定方向上的点计数来引导用户到当前地图视图之外的点。 |
演示 | 威廉·洛 |
Leaflet.SlideMenu |
一个简单的用于 Leaflet 的滑块菜单。 |
演示 | Masashi Takeshita |
Leaflet.Slider |
添加一个 |
演示 | EPP |
Leaflet.Spin |
使用 Spin.js 在地图上显示一个漂亮的微调器,用于异步数据加载,例如与 Leaflet Ajax 一起使用。 |
演示 | Mathieu Leplatre |
Leaflet.TileLegend |
为您的背景图层创建带插图和交互式的图例。 |
演示 | Yohan Boniface |
Leaflet.toolbar |
用于 Leaflet 地图的灵活、可扩展的工具栏。 |
演示 | Justin Manley |
Leaflet 天气 |
一个 Leaflet 插件,用于使用 OpenWeatherMap API 将天气小部件添加到地图中。 |
演示 | 奥斯克 |
leaflet-blurred-location |
一个基于 Leaflet 的界面,用于选择“模糊”或低分辨率位置,以保护隐私。 |
演示 | Public Lab |
leaflet-blurred-location-display |
巧妙地使用彩色热图和彩色标记显示“模糊”位置,同时从远程 API 获取数据。 |
演示 | Public Lab |
leaflet-control-window |
在您的地图中创建模态/非模态、可拖动、响应式、可自定义的窗口。 |
演示 | mapshakers |
leaflet-sidebar |
一个响应式侧边栏插件。 |
演示 | 托比亚斯·比尼克 |
leaflet-sidebar-v2 |
一个响应式、带选项卡的侧边栏,具有 HTML 和 JS API。与旧版 (0.7) 和当前版 Leaflet 兼容。 |
演示 | 诺尔温·鲁森 |
sidebar-v2 |
另一个响应式侧边栏插件。这次带选项卡! |
演示 | 托比亚斯·比尼克 |
打印/导出
打印或导出您的地图。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.BigImage |
允许用户下载包含可见地图的放大版本的图像。 |
演示 | 瓦西里·帕西奇尼克(奥斯瓦尔德) |
leaflet.browser.print |
允许用户直接从浏览器打印全页面地图。 |
演示 | Igor Vladyka |
Leaflet.print |
实现 Mapfish 打印协议,允许使用 Mapfish 或 GeoServer 打印模块打印 Leaflet 地图。 |
Adam Ratcliffe | |
Leaflet-easyPrint |
一个简单的插件,用于添加一个图标来打印您的 Leaflet 地图。 |
演示 | Rowan Winsemius |
Leaflet-image |
通过使用 Canvas 和 CORS,无需服务器组件即可从 Leaflet 地图中导出图像。 |
演示 | Tom MacWright |
leaflet-route-print |
通过用一系列相同的矩形覆盖路线,自动生成路线(即折线)的 PDF 打印,并具有自定义比例、纸张大小和边距。 |
演示 | 赫尔曼·斯莱特莫恩 |
地理定位
扩展 Leaflet 的地理定位功能的插件。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
吉奥莱特 |
一个简单但高度可自定义的 Leaflet 地理定位插件。 |
演示 | 鲁本·霍尔特伊森 |
L.LocationShare |
允许用户发送和接收带有消息的标记。 |
演示 | atstp |
Leaflet.AccuratePosition |
Leaflet.AccuratePosition 旨在提供所需的设备位置精度。 |
演示 | 迈克尔·施密特-福伊格特 |
Leaflet 控件指南针 |
一个 Leaflet 控件插件,用于构建一个简单的旋转指南针。 |
演示 | Stefano Cudini |
Leaflet.Locate |
一个可自定义的定位控件。 |
演示 | Dominik Moritz |
Leaflet.SimpleLocate |
一个 Leaflet 插件,在地图上显示设备位置和方向,方向根据屏幕旋转进行调整。 |
演示 | mfhsieh |
杂项
地理处理
以下插件执行多种地理处理(对点、线和多边形的数学和拓扑运算)。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
arc.js |
一个用于绘制大圆路线的 JS 库,可与 Leaflet 一起使用。 |
戴恩·斯普林迈尔 | |
格莱纳-霍曼 |
适用于 Leaflet 的格莱纳-霍曼多边形剪切和二元运算算法。 |
演示 | Alexander Milevski |
Leaflet.Antimeridian |
一个插件,允许多边形和折线自然地穿过反子午线(或国际日期变更线),而不是总是围绕格林尼治子午线环绕。 |
演示 | 布里安娜·兰登 |
Leaflet.buffer |
启用对使用 Leaflet.draw 绘制的形状进行缓冲。 |
Jonathan Skeate | |
Leaflet.GeometryUtil |
Leaflet 几何体实用程序集合(线性参考等)。 |
Benjamin Becquet | |
Leaflet.LayerIndex |
一个针对要素和图层的有效空间索引,使用 RTree.js。 |
演示 | Mathieu Leplatre |
Leaflet.UTM |
一种将 L.LatLng 转换为 UTM(WGS84)反之亦然的方法。UTM 字符串格式易于配置。它不依赖于任何其他插件或第三方。 |
演示 | Javier Jimenez Shaw |
Leaflet-pip |
使用 point-in-polygon 进行简单的点在多边形内计算。 |
演示 | Tom MacWright |
leaflet-spatial-prefix-tree |
用于可视化空间前缀树、四叉树和 geohash 的 Leaflet 插件。 |
演示 | Mapzen |
Proj4Leaflet |
Proj4js 集成插件,允许您在 Leaflet 中使用各种奇怪的投影。 |
演示 | Kartena |
路由
以下插件使用外部服务来计算驾驶或步行路线。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Leaflet.Reachability |
使用 openrouteservice 等时线 API 显示基于时间或距离的不同出行方式的可达区域。 |
演示 | 特拉福德数据实验室 |
Leaflet RouteBoxer |
这是 Google 的 RouteBoxer Class 的 Leaflet 实现。Leaflet RouteBoxer 类生成一组 L.LatLngBounds 对象,这些对象保证覆盖路径指定距离内的每个点。 |
演示 | 斯特凡·格奥尔格 |
Leaflet RouteToAddress |
用于从自定义地址到固定地址进行路线搜索的控件。该插件集成了一个简单的地理编码器,该编码器使用 OpenstreetMap Nominatim 按地址定位地点。非常适合在网站上描述“找到到达我们路线”的方向。默认情况下使用 OSRM,但也支持 Mapbox Directions API。 |
演示 | 阿斯特丽德·根特 |
Leaflet.Routing.Amap |
使用 AMap(高德地图) 作为后端的路线搜索控件。支持中文 BD09 和 GCJ02 坐标系、彩色线条和逐向弹出窗口。 |
演示 | 杰克·古德 |
Leaflet Routing Machine |
用于进行路线搜索的控件,带中途点,显示行程和备用路线。默认情况下使用 OSRM,但也支持 GraphHopper、Mapbox Directions API 等。 |
演示 | Per Liedman |
Leaflet.Routing |
Leaflet 控制器和界面,用于使用任何用户提供的路线服务在航点之间路由路径。 |
挪威徒步旅行协会 | |
leaflet.TravelNotes |
带有可编辑标记和 Leaflet 路由引擎的独立应用程序。该路由引擎有 Mapbox、GraphHopper 和 OSRM 的插件,可用于汽车、自行车或步行路线。 |
演示 | Christian Guyette |
Leaflet TripGo 路由 |
TripGo 移动平台允许您创建应用程序,使用任何公共、私人或商业交通方式提供无缝且个性化的门到门行程。TripGo Leaflet 的插件动机是提供一种将其实用功能包含到外部平台中的简单方法。 |
演示 | SkedGo |
Targomo JS |
Targomo 可视化从一组起点在给定时间内可到达的区域,并提供到目标的详细路线信息(步行、骑自行车、开车和公共交通)。 |
演示 | 塔尔戈莫有限公司 |
地理编码
将地址或地点名称转换为经纬度(反之亦然)的外部服务。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Esri Leaflet Geocoder |
一个由 ArcGIS Online 地理编码器提供支持的地理编码控制,带有建议。 |
演示 | Patrick Arlt |
MapTiler 的地理编码 |
Leaflet 的地理编码和反向地理编码插件,利用 MapTiler 地理编码 API,包括识别州、城市、街道,直至地址和兴趣点级别。它支持多种语言的搜索结果、按国家/地区的限制、模糊匹配、自动完成等。 |
演示 | M. Ždila | MapTiler |
L.Highlight |
一个插件,它通过 Nominatim 添加了快速突出显示街道和区域的功能。 |
演示 | Maciej Kowalski |
Leaflet.Autocomplete |
Leaflet.Autocomplete 用于扩展自动建议插件,使其能够以您认为需要的方式进行地理编码并在地图上显示数据。DEMO 基于使用 OpenStreetMap Nominatim 通过地址定位地点。无障碍,完全支持 ARIA 属性和键盘交互。 |
演示 | Grzegorz Tomicki |
Leaflet Control Bing Geocoder |
一个简单的地理编码控制,使用 Bing 定位地点。您可能还会对它的分支机构 Leaflet Control Geocoder 感兴趣。 |
演示 | Samuel Piquet |
Leaflet Control Geocoder |
用于地理编码和反向地理编码的干净且可扩展的控制。内置支持 Nominatim、Bing、MapQuest、Mapbox、What3Words、Google 和 Photon。易于扩展到其他提供商。 |
Per Liedman | |
Leaflet Control OSM Geocoder |
一个简单的地理编码器,使用 OpenStreetMap Nominatim 通过地址定位地点。 |
演示 | Karsten Hinz |
Leaflet Geoapify 地址搜索 |
在 Geoapify 的支持下,在地图中添加地址自动完成字段。 |
演示 | Geoapify |
Leaflet GeoIP 定位器 |
一个简单的插件,允许查找 IP 地址的大致位置并将地图居中在该位置。 |
Jakub Dostal | |
Leaflet.Geonames |
一个轻量级地理编码控制,由 GeoNames 提供支持。 |
演示 | Brendan Ward |
Leaflet GeoSearch |
一个小型的地理编码插件,它将地址搜索/查找(也称为地理搜索)带到 Leaflet。 |
演示 | Stephan Meijer |
Leaflet LocationIQ Geocoder |
一个插件,它通过 LocationIQ 添加了搜索(地理编码)Leaflet 支持的地图的功能。 |
演示 | LocationIQ |
Leaflet.OpenCage.Geocoding |
一个插件,它使用 OpenCage 的地理编码 API 进行正向或反向地理编码。 |
演示 | OpenCage |
Leaflet.OpenCage.Geosearch |
一个插件,它使用 OpenCage 的地理搜索 进行位置自动建议。 |
演示 | OpenCage |
Leaflet-search |
一个带有自动完成/建议功能的搜索控件。支持 Nominatim、GeoNames、Here、TomTom 和 Kadaster(荷兰)。 |
演示 | Sjaak Priester |
Pelias Leaflet 插件 |
一个使用 Geocode Earth 或任何由 Pelias Geocoder API 提供支持的托管服务的地理编码控制。 |
演示 | Lou Huang |
插件集合
跨越多个类别的插件集。
插件开发者:请将未来的插件保留在单独的存储库中。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
与 MapBBCode 相关的 Leaflet 插件 |
七个插件用于各种功能,独立于 MapBBCode 库。从圆形和弹出式图标到按钮、图层切换器、更好的搜索和属性。 |
Ilya Zverev | |
Pavel Shramov 的插件 |
一组用于:GPX、KML、TOPOJSON 图层;Bing 切片图层;Yandex 图层(使用其 API 实现)和永久链接控制。 |
Pavel Shramov | |
Spectrum4Leaflet |
使用 Leaflet 使用 Spectrum Spatial Server 服务的工具。此插件支持:地图服务、切片服务、要素服务。它具有图层、图例和要素控件。 |
SVoyt |
集成
框架和构建系统
简化将 Leaflet 集成到开发框架中的过程,或自动完成某些复杂应用程序的 javascript/CSS 工作。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
Angular Leaflet 指令 |
将 Leaflet 集成到使用 AngularJS Web 框架构建的应用程序中。 |
演示 | David Rubert |
Django Leaflet |
在您的 Django 项目中使用 Leaflet。包括管理集成、表单小部件、模板标签等等! |
Makina Corpus | |
ember-leaflet |
使用 Leaflet 为 Ember.js 提供简单且声明式的映射。 |
Miguel Andrade | |
gwty-leaflet |
Leaflet 的 Java/GWT JsInterop 包装器。它允许像使用 javascript 脚本一样在 Java 中使用 Leaflet。 |
Zakaria Amine | |
JSF2Leaf |
Leaflet 的 JavaServer Faces 包装器。 |
Leonardo Ciocari | |
L.Control.BootstrapModal |
使用地图上控件触发 Bootstrap 模态。 |
Greg Allensworth | |
L.Control.jQueryDialog |
使用地图上控件触发 jQuery UI 对话框/模态。 |
演示 | Greg Allensworth |
Leaflet.a11y |
Leaflet 的可访问性和本地化/翻译插件。 |
演示 | Nick Freear |
Leaflet Control Angular |
将 Angularized HTML 代码作为 Leaflet 控件插入到您的 Leaflet 地图中并使用它。 |
Grant Harris | |
Leaflet.CSS |
从 JavaScript 内部添加主要的 Leaflet CSS 文件(或任何 css),告别条件注释。 |
演示 | Calvin Metcalf |
Leaflet.i18n |
Leaflet 插件的国际化。 |
Yohan Boniface | |
Leaflet.jsf |
Leaflet 的全面的 Java Server Faces(JSF) 组件/包装器。 |
Terra SI LLC。 | |
Leaflet LayerConfig |
提供一个 json 文件或服务响应,其中包含图层和标记的配置,以自动设置 Leaflet 客户端。 |
Alexander Nossum | |
Leaflet 地图构建器 |
它根据配置对象填充 Leaflet 地图,还可以创建缩放、图层、属性绘制控件。 |
演示 | Gherardo Varando |
Leaflet 地图组件 |
将 Leaflet 集成到使用 Polymer 0.5 Web 框架构建的应用程序中。 |
演示 | Prateek Saxena |
Leaflet Popup Angular |
在您的 Leaflet 弹出窗口中使用 AngularJS。扩展内置的 L.popup。 |
演示 | Grant Harris |
Leaflet.translate |
Leaflet 核心和插件的本地化/翻译插件。 该插件包含翻译/语言包文件以及加载它们的代码。 |
演示 | Nick Freear |
Leaflet Yeoman 生成器 |
Yeoman 生成器,它搭建了一个基本的 Leaflet 地图应用程序。 |
演示 | Moritz Klack |
Leaflet 缩放级别 CSS 类 |
向地图元素添加缩放级别 CSS 类,以便根据缩放级别轻松更新样式 |
Dag Jomar Mersland | |
leaflet-defaulticon-compatibility |
从 CSS 中检索所有 Leaflet 默认图标选项,尤其是所有图标图像 URL,以提高与修改 CSS 中 URL 的捆绑程序和框架的兼容性。特别是对于 webpack(带有 style-、css-、file- 和 url-loader)、Rails Asset Pipeline 和 Django pipeline。应该解决与 Leaflet/Leaflet #4968 相关的所有用例。使用 webpack 的演示 (以及 没有此插件的演示)。 |
演示 | ghybs |
leaflet-geoserver-request |
Leaflet 中的基本 geoserver 请求。目前支持 Leaflet 上的 wms、wfs、图例、wmsImage 请求。 |
演示 | Iamtekson |
leaflet-map |
将 Leaflet 集成到使用 Polymer >= 1.0 Web 组件框架构建的应用程序中。 |
演示 | Hendrik Brummermann |
leaflet-rails gem |
此 gem 为您的 Rails 5 应用程序提供了 leaflet.js 地图显示库。RubyGems 上的 leaflet-rails |
Akshay Joshi | |
meteor-leaflet |
提供一个 Meteor 包,以便快速构建实时跨平台地图应用程序。 |
Bevan Hunt | |
ngx-leaflet |
用于 Angular.io 的 Leaflet 组件和扩展。 |
Asymmetrik, Ltd. | |
react-leaflet |
用于 Leaflet 地图的 React 组件。 |
演示 | Paul Le Cam |
Tiny Leaflet Directive |
用于 AngularJS 应用程序的小型 LeafletJS 地图指令。 |
Martin Tesař | |
V-Leaflet |
将 Leaflet 作为 Vaadin Java/HTML 框架的组件使用。 |
Matti Tahvonen | |
Vue2Leaflet |
Vue2Leaflet 是一个用于 Vue.js 框架的 JavaScript 库,它包装了 Leaflet,使其易于创建响应式地图。 |
演示 | Mickaël KoRiGaN |
YAGA leaflet-ng2 |
细粒度集成到 Angular2/4 中。 |
YAGA Development Team |
第三方集成
以下插件将 Leaflet 集成到第三方服务或网站中。
插件 | 描述 | 演示 | 维护者 |
---|---|---|---|
ABP Usermap MyBB |
一个用于 MyBB 的插件,它基于 OpenStreetMap 和 Leaflet 创建用户地图,并具有可自定义的弹出窗口和标记 |
CrazyCat | |
HA 地图卡 |
一个基于 Leaflet 的 Home Assistant 地图卡,它包含比库存地图卡(也基于 Leaflet)更高级的功能。 |
Nathan Bijnens | |
Joomla!(3.x) | 阿斯特丽德·根特 | ||
Leaflet Easymap |
在您的 HTML 页面中包含一个地图,无需一行编程。一个数据驱动的 Javascript 模块。 |
演示 | Klaus Stein |
Leaflet.EditInOSM |
添加一个带有链接的控件,用于在主要 OSM 编辑器中打开当前地图视图。 |
演示 | Yohan Boniface |
Leaflet.Facebook |
一个简单的插件,用于添加 Facebook 喜欢按钮作为控件。 |
Marcin Wasilewski | |
Leaflet for Drupal |
一个 Drupal(7.x 和 8.x)模块,用于在您的 Drupal 网站中集成 Leaflet 地图。包含一个字段格式化程序,用于为包含地理空间数据的字段显示地图,Views 集成用于在地图上绘制数据,以及一个轻量级且易于使用的 API。目前,超过 10,000 个网站使用它。 |
Marzee Labs | |
Map Block Leaflet |
一个基于 Leaflet 的新 WordPress 块编辑器的块,它允许从可视界面添加和自定义地图。 |
Jesús Olazagoitia | |
Maps Marker Pro |
一个 WordPress 插件/综合地理内容管理系统,允许用户固定、整理和分享他们最喜欢的地点和轨迹以及海拔图表。还集成了几个 Leaflet 插件,如 leaflet-bing-layer、leaflet-edgebuffer、leaflet-fullscreen、leaflet-gesture-handling、leaflet-minimap、leaflet.gridlayer.googlemutant、leaflet.locatecontrol、leaflet.markercluster 和 leaflet-geoman-free。 |
演示 | Robert Harm |
Maptiks |
用于 Web 地图的分析平台。跟踪地图活动、图层加载时间、标记点击次数等等! |
Sparkgeo | |
WordPress Leaflet 地图 |
交互式且灵活的短代码,用于在帖子和页面中创建多个地图,以及在这些地图上添加多个标记。 |
Benjamin J DeLong | |
位置和区域 |
WordPress 插件,用于在一个地图上展示分布广泛的位置,并提供区域导航标签。该地图基于 Leaflet JS,并提供多种免费地图风格。包含 Gutenberg 块。 |
100plugins | |
WP MapIt |
基于 Open Street Map 和 Leaflet 的易于使用的 WordPress 地图插件,具有自定义标记图像、描述和链接。 |
Chandni Patel | |
Open User Map |
WordPress 插件,允许您的访客直接从前端添加位置,无需注册。他们可以在地图上放置一个标记并提供一些位置详细信息。提交后,位置提议将处于“待处理”状态,并等待您的审核批准以发布。 |
演示 | 100plugins |
WP-Trip-Summary |
WordPress 旅行摘要插件,帮助旅行博主管理和展示有关火车旅行、自行车旅行或徒步旅行的结构化信息。 |
演示 | Alexandru Boia |
Yii2-locator |
用于 Yii2 PHP 框架 的 Leaflet 小部件。存储在 ActiveRecord 中的地理数据可以在交互式地图上显示和更新。 |
演示 | Sjaak Priester |
开发您自己的
Leaflet 保持简单。如果您能想到一个并非所有 Leaflet 用户都需要的功能,并且可以以可重用的方式编写 JavaScript 代码,那么您已经拥有了一个 Leaflet 插件。
创建您自己的插件没有硬性要求,但我们鼓励所有开发人员阅读 插件指南 中的建议。
插件准备就绪后,您可以提交它:只需向我们的 GitHub 存储库发送包含 /docs/_plugins/ 中新的插件文件。