ICA-Proc

Proceedings of the ICA

ICA-Proc

Proc. Int. Cartogr. Assoc.

2570-2092

Copernicus Publications

Göttingen, Germany

10.5194/ica-proc-7-2-2025

Auto-generalized labels on multi-layer Leaflet maps

Gede

Mátyás

https://orcid.org/0000-0002-8639-2812

Institute of Cartography and Geoinformatics, ELTE Eötvös Loránd University, Budapest, Hungary

21 10 2025

2025

This work is licensed under the Creative Commons Attribution 4.0 International License. To view a copy of this licence, visit https://creativecommons.org/licenses/by/4.0/

This article is available from https://ica-proc.copernicus.org/articles/7/2/2025/ica-proc-7-2-2025.html

The full text article is available as a PDF file from https://ica-proc.copernicus.org/articles/7/2/2025/ica-proc-7-2-2025.pdf

Leaflet is one of the most popular client-side web mapping libraries. It is lightweight, easy-to-use, especially for ones without strong programming background. The library, however, lacks a very important feature: map labels. The author developed a plugin for Leaflet that makes it easy to show map labels for any vector layer. Labels are automatically generalized to avoid overlapping texts. Point symbols or markers can be linked to their labels i.e. if the label cannot be displayed, its marker is also removed. Labels are drawn in priority order. Priorities, as well as label texts and styles can be highly customized with respect to feature/layer properties. Labels are displayed as HTML <code></code> elements, allowing developers to create complex labels with various borders or backgrounds as well, by CSS styling rules. The plugin extends the Map class, while label properties can be set for each layer separately. Collision conflicts are checked between layers as well. Dynamic addition/removal of map objects is also supported. Performance of the plugin was tested with 3700 map objects (mixed data of points, polygons, and lines). Updating map labels after zoom/pan required only fragments of seconds. The source code, user guide and examples are available at <code>https://github.com/samanbey/leaflet-mapwithlabels</code>