Leaflet - interactive maps with JavaScript

Leaflet is a lightweight and powerful open-source JavaScript library for creating mobile-friendly interactive maps. Leaflet mapping resources can be integrated into Plone using collective.js.leaflet add-on.

leaflet javascriptLeaflet is a lightweight but powerful open-source JavaScript library for creating mobile-friendly interactive maps. This elegant library was developed aiming at simplicity, usability and high performance. Its code is modular, extensible and easy to understand. Leaflet doesn’t do everything, but it focuses on making the basic functionality work perfectly so that deploying maps on a web page becomes easy.

Leaflet provides JavaScript file that loads with a web page and gives access to a set of functions that help display a map. Maps built using Leaflet work efficiently and smoothly across all major desktop (Chrome, Firefox, Safari, Opera, IE 7–11) and mobile (iOS, Android) platforms out-of-the-box. Leaflet uses latest browser technology like HTML5 and CSS3, but is still accessible on older versions.

Leaflet does not have any external dependencies and keeps JS environment clean. It also has easy-to-use and well-documented API. Leaflet provides all the essential features for online maps to ensure a pleasant and smooth user experience. Available features:

  • map layers (tile and vector layers, markers, popups, GeoJSON and WMS layers, image overlays, layer groups);
  • interaction features (scroll wheel/double click zoom and keyboard navigation for desktop browsers, multi-touch/double tap zoom for mobile browsers, marker dragging, etc.);
  • visual features (zoom and panning animation, default design for markers, popups and other map controls, tile and popup fade animation, retina resolution support for tile layers and markers);
  • customization (a simple interface for implementing custom map layers and custom map controls, pure CSS3 popups and controls to ensure easy restyling, image- and HTML-based markers, custom map projections, etc.);
  • performance features (using modern CSS3 features for smoother panning and zooming, hardware acceleration on iOS, tap delay elimination on mobile devices, smart polyline/polygon rendering);
  • map controls such as zoom buttons, attribution, layer switcher, scale.

Besides the core Leaflet features, there are over 80 third-party plugins to extend the library’s functionality and satisfy the needs of the map apps developers. Leaflet can be extended with the features like measuring distance, overlaying a heatmap, manipulating layers and displaying coordinates, animating markers, drawing complex shapes, loading and converting CSV, KML, GPX, TopoJSON, WKT formats into Leaflet, geocoding (address searching), routing and route search, panning/zoom slider/customizable locate controls, etc.

Leaflet is a simple and functional JavaScript library. Among its main advantages are small size, desktop and mobile browser support, wide range of out-of-the-box features (markers, popups, zoom, pan, overlay lines and shapes, multiple layers, etc.), and extensibility. Leaflet mapping resources can be integrated into Plone using collective.js.leaflet add-on. To get more information visit leafletjs.com.

Connect with our experts Let's talk