MapLibre vs. Leaflet vs. OpenLayers
Die drei Open-Source-Bibliotheken für Karten in einer Webseite im Vergleich: wie sie zeichnen, Vektorkacheln, 3D, Projektionen, Datenformate und Downloadgrösse, mit derselben Karte aus jeder. Die Zahlen sind vom 2. November 2026.
- MapLibre GL JS, wenn die Grundkarte zählt: Vektorstile, flüssiger Zoom, Neigung, 3D-Gelände und ein Globus. Es braucht WebGL 2 und ist der grösste Download.
- Leaflet für Marker, Popups und Formen auf einer Grundkarte, mit vielen Plugins, im kleinsten Download. Vektorkacheln brauchen ein Plugin.
- OpenLayers für GIS-Arbeit: viele Formate und Kartendienste, jede Projektion, Zeichnen und Bearbeiten eingebaut.
Nebeneinander
| MapLibre GL JS | Leaflet | OpenLayers | |
|---|---|---|---|
| Aktuelle Version | 6.16.0, 25. Okt. 2026 | 1.9.4, 18. Mai 2023; 2.0.0-beta.1 am 2. Nov. 2026 | 10.11.0, 4. Okt. 2026 |
| npm-Downloads, 26. Okt. bis 1. Nov. 2026 | 9,1 Millionen | 10,9 Millionen | 1,2 Millionen |
| Lizenz | BSD-3-Clause | BSD-2-Clause | BSD-2-Clause |
| Zeichnet mit | WebGL 2 | Bildkacheln, Formen mit SVG oder Canvas | Canvas 2D, WebGL für einige Layer |
| Vektorkacheln mit Stil | Eingebaut | Mit einem Plugin | Eingebaut; MapLibre-Stile mit ol-mapbox-style |
| Neigung und 3D-Gelände | Ja | Nein | Nein |
| Drehen | Ja | Nein | Ja |
| Projektionen | Web Mercator und ein Globus | Web Mercator; andere mit Proj4Leaflet | Jede Projektion, die proj4 kennt; Bild-Layer werden umprojiziert |
| Datenformate | GeoJSON, Vektor- und Rasterkacheln, Bilder, Video | GeoJSON und WMS; weitere mit Plugins | GeoJSON, KML, GPX, GML, TopoJSON, WKT, WFS, WMS, WMTS, GeoTIFF und mehr |
| Zeichnen und Bearbeiten | Mit Plugins | Mit Plugins | Eingebaut |
| TypeScript-Typen | Enthalten | In @types/leaflet | Enthalten |
Versionen, Daten, Lizenzen und Downloads aus der npm-Registry. Die npm-Downloads zählen jede Installation, auch über andere Pakete wie react-map-gl.
Dieselbe Karte in jeder
Unser Stil Light über Zürich, von jeder Bibliothek aus denselben Vektorkacheln gezeichnet:
Downloadgrösse
| Eine einfache Karte | JavaScript, gzip |
|---|---|
| Leaflet mit Bildkacheln | 41 KB |
| OpenLayers mit Bildkacheln, gebündelt | 66 KB |
| Leaflet mit protomaps-leaflet | 77 KB |
| OpenLayers mit ol-mapbox-style, gebündelt mit Vite | 151 KB |
| Leaflet mit maplibre-gl-leaflet und MapLibre 5 | 311 KB |
| MapLibre GL JS 6.16, gebündelt mit Vite | 282 KB, und 143 KB für den Worker |
Gemessen an den minifizierten Dateien von npm oder am Build einer Seite mit einer Karte, komprimiert mit gzip -9. Bildkacheln sind Bilder von einem Kachelserver; overpass.ch liefert nur Vektorkacheln.
MapLibre GL JS
MapLibre entstand im Dezember 2020 als Fork von Mapbox GL JS 1.13 und zeichnet die ganze Karte auf der Grafikkarte: Zoom und Drehen laufen flüssig, und die Karte neigt sich für 3D-Gelände und Gebäude. Ein Stil beschreibt alles in einer JSON-Datei; andere Farben oder eine andere Sprache der Beschriftung brauchen also keine neuen Kacheln. MapLibre 6 braucht WebGL 2 und gibt es nur als ES-Module. Unsere Stile sind dafür gemacht.
MapLibre GL JS: Anleitung für die erste Karte
Leaflet
Leaflet legt Bildkacheln in ein Raster und Marker, Popups und Formen darüber, mit SVG oder Canvas. Seine Plugins decken Clustering, Heatmaps, Zeichnen, Routing und vieles mehr ab. Für Vektorkacheln hat es keinen Renderer: maplibre-gl-leaflet setzt eine MapLibre-Karte als Layer in Leaflet, und protomaps-leaflet zeichnet die Kacheln von Protomaps auf Canvas. Leaflet 2.0 ist in der Beta: Es kommt als ES-Module, und new Marker(…) ersetzt L.marker(…).
OpenLayers
OpenLayers liest die meisten GIS-Formate und -Dienste selbst, arbeitet in jeder Projektion, die proj4 kennt, und hat Werkzeuge zum Zeichnen, Ändern und Einrasten von Objekten. Es zeichnet Vektorkacheln auf Canvas, und ol-mapbox-style macht aus einem MapLibre-Stil OpenLayers-Stile; einige Teile der Stilspezifikation fehlen, deshalb sieht nicht jeder Stil aus wie in MapLibre. Für diese kann MapLibre die Grundkarte als OpenLayers-Layer zeichnen.
Von Leaflet zu MapLibre
- Die Koordinaten drehen sich um: Leaflet nimmt
[Breite, Länge], MapLibre und GeoJSON[Länge, Breite]. - Die Zoomstufen unterscheiden sich um eins: MapLibre-Zoomstufe 12 zeigt das Gebiet von Leaflet-Zoomstufe 13.
- Aus
L.markerwirdmaplibregl.Marker, ausbindPopupwirdsetPopup, und GeoJSON-Layer werden zu einer Quelle und einem Layer des Stils.
Die Kacheln
Alle drei zeigen die Vektorkacheln und Stile von overpass.ch mit einer Stil-URL und einem Schlüssel. Jedes Konto enthält 100'000 Kartenkacheln im Monat; die Seite Kartenkacheln zeigt die Stile auf einer Live-Karte und die Preise.