leaflet/leaflet

🍃 JavaScript library for mobile-friendly interactive maps 🇺🇦

Leaflet was created 11 years ago by Volodymyr Agafonkin, a Ukrainian citizen living in Kyiv.

Russian bombs are now falling over Volodymyr's hometown. His family, his friends, his neighbours, thousands and thousands of absolutely wonderful people, are either seeking refuge or fighting for their lives.

Russian soldiers have already killed tens of thousands of civilians, including women and children, and are committing mass war crimes like gang rapes, executions, looting, and targeted bombings of civilian shelters and places of cultural significance. The death toll keeps rising, and Ukraine needs your help.

As Volodymyr expressed a few days before the invasion:

If you want to help, educate yourself and others on the Russian threat, follow reputable journalists, demand severe Russian sanctions and Ukrainian support from your leaders, protest the war, reach out to Ukrainian friends, donate to Ukrainian charities. Just don't be silent.

Ukrainians are recommending the Come Back Alive charity. For other options, see StandWithUkraine.

If an appeal to humanity doesn't work for you, I'll appeal to your egoism: the future of Ukrainian citizens is the future of Leaflet.

It is chilling to see Leaflet being used for documenting Russia's war crimes, factual reporting of the war and for coordination of humanitarian efforts across Europe. We commend these uses of Leaflet.

If you support the actions of the Russian government (even after reading all this), do everyone else a favour and carry some seeds in your pocket.

Yours truly,
Leaflet maintainers.

---

Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps. Weighing just about 42 KB of gzipped JS plus 4 KB of gzipped CSS code, it has all the mapping features most developers ever need.

Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms out of the box, taking advantage of modern browser features while being accessible on older ones too. It can be extended with a huge amount of plugins, has a beautiful, easy to use and well-documented API and a simple, readable source code that is a joy to contribute to.

For more info, docs and tutorials, check out the official website.
For Leaflet downloads (including the built main version), check out the download page.

We're happy to meet new contributors. If you want to get involved with Leaflet development, check out the contribution guide. Let's make the best mapping library that will ever exist, and push the limits of what's possible with online maps!

leaflet's Issues

ImageOverlay onRemove method

Map tilesload event

No popup fade animation in Firefox

Basic zoom control

Zoom slider control

Double click zoom doesn't work if popup is opened on click

Thanks to greencaps for reporting this.

Occasional error on TileLayer.js:146 on mobile webkit

Popup content doesn't always update on setContent

Additional tile layers flicker after zoom animation

When you zoom in, the animation goes fine with several layers, but in the end, after the first layer is loaded, other layers scaled from previous zoom disappear under it, which is seen as an annoying layer flickering.

Double tap on mobile WebKit

Flickering of vector layers on drag end under mobile WebKit

ImageOverlay with GIF Not Loading on iOS

When loading an image on desktop Safari browser it works fine, but will not load on the iOS webview (or in the iOS Safari browser).

It generates a "Malformed GIF" error message in the console log window.

Example:

var wxImageBounds = new L.LatLngBounds(new L.LatLng(21.65,-127.62), new L.LatLng(50.4,-65.89));
var wxImage = new L.ImageOverlay("http://radar.weather.gov/Conus/RadarImg/latest_radaronly.gif", wxImageBounds);
map.addLayer(wxImage);

Background tiles sometimes clear on zoom

Background tiles disappear If you zoom in and then zoom in more not waiting for the tiles to load.

WMS image service support

Marker dragstart/drag/dragend events docs

TileLayer layerload event

Marker dragend event

Could you implement marker dragend event (triggered when the dragging has ended)? What I personally need it for (and I think others would use it) is to save in the database the resulting LatLng values, after the dragging has ended.

Ability to hide/show markers and layer groups

KML support

Path mouse events

Popup anchor has a tiny offset

Don't hide markers while zooming

Markers disappear during zooming, it would be nice if were always visible

I don't know if this is even possible (or at least possible with out killing frame rate) as google maps does the same thing

Marker setLatLng method

Chrome sometimes doesn't animate zoom properly

If you try to zoom in/out while some tiles are still loading, Chrome will jump to the new zoom immediately instead of animating it.

ability to pass HTMLElement instead of String in L.Popup constructor

GeoJSON support

Tap instead of click on mobile WebKit

Click handlers are not very responsive - there's a huge delay, so implement handling touches like clicks in mobile WebKit.

zoomControl option in Map

Attribution control

Mouse wheel zoom

Zooming breaks down

Zooming breaks down sometimes. Especially often with the quick zooming by mousewheel.

Seen in Firefox and Opera.
Firebug prints "f is undefined".

Mouseover/out/move map events

Occasional flicker on zoom animation under Android 2.2

GeoRSS support

Popup should close before any other map click handlers

Panning intertia on mobile WebKit

Url template doesn't work if a value appears twice in it

Thanks to greencaps for reporting.

Marker dragging

Mouse event delegation for overlays

Event delegation should improve performance considerably in case of, say, thousands of markers on a map.

Mouseover/out/move path events

Path clickable option, hand cursor

Map disappears in some zoom cases under iOS

Buggy zoom animation on Android (2.2, Nexus One)

Android animates transform in quite a weird way... Needs checking out.

Marker click broken

Clear background tiles after front tiles loaded

bindPopup for paths (circle, polyline, polygon)

Controls located under all other layers

No Z-index specified in the css, so they show up beneath the layers (at least in FF 3.6)

Update Popup docs

Canvas Path fallback

Android doesn't support SVG, so implement a Canvas fallback for Path drawing (circles, polylines, polygons).

Additionally, certain types of data will perform much better on Canvas vs SVG - for example, many thousands of circle markers.

Rename Circle to CircleMarker, create a zoom-dependent Circle