Leaflet
Listed on the page, you will find the most comprehensive and free sources online.
Image credit: Leaflet
Leaflet an open-source JavaScript library for mobile-friendly interactive maps created by Vladimir Agafonkin.
Tutorials
-
Welcome to the Web Map Workshop series by “ DUSPviz”
- Intro to Websites (HTML/CSS)
- Using Bootstrap: Website Frameworks and Templates
- Web Map Fundamentals/Make a Basic Web Map
- Introduction to JavaScript: Core Concepts
- JavaScript Interactions and Leaflet
- Choropleth Mapping and Custom Symbolization
- Introduction to PostGIS: Using CARTO and Leaflet
- Advanced Mapping: Data Collection with PHP and the CARTO API
- Advanced Mapping: Leaflet with PostGIS/NodeJS/Express
-
Leaflet Map Templates by “ Data Visualization for All”
-
Two Weeks of Leaflet by “ Spatial Galaxy”
- Two Weeks of Leaflet - Day 1
- Leaflet Day 2 - Adding a Marker
- Leaflet Day 3 - The Trail
- Leaflet Day 4 - Basemaps and Overlays
- Leaflet Day 5 - Working with Features
- Leaflet Day 6 - GeoPackage Layers
- Leaflet Day 7 - Coordinates
- Leaflet Day 8 - Zoom to Feature
- [Leaflet Day 9 - Calculating Distance with Turf.js](Leaflet Day 9 - Calculating Distance with Turf.js)
- Leaflet Day 10 - Adding a Link to a Popup
- Leaflet Day 11 - Plugins
- Leaflet Day 12 - Create a Leaflet Map from QGIS
- Leaflet Day 13 - Styling with a Plugin
- Leaflet Day 14 - Image Overlay and Wrap-up
-
Using Leaflet with Shiny by “ RStudio”
-
Make Web Map with Leaflet
- Leaflet Introduction
- Leaflet: Make a web map!
- Leaflet and Mapbox JavaScript API Fundamentals
- Visualising VGI with Leaflet
- Perceptual scaling of prop symbols
- Heatmap
- GitHub Web Hosting
- Cartographic Perspectives “On The Horizon” Tutorials
- Geojson CSS
- GeoJSON CSS Vector layer and vector feature style
- Load Google Spreadsheet to visualize with leaflet
- Leaflet Thematic Polygon Map with Multi-Year Tabs template
- Leaflet maps with data from Google Sheets
-
Leaflet Zip Code Map
Plugin
-
Great Leaflet plugins
- Ajax
- Omnivore
- Shapefile
- Awesome-markers plugin v2.0
- Maki - Icon set made for map designers.
- MakiMarkers
- Marker cluster
- Draw
- Geometry Management
- Control osm geocoder
- Control Geocoder
- Search
- AgentMaps - Social Simulations on Interactive Maps
- Working with PostGIS data from within Leaflet.js (or any other client side mapping API)
- geolocate the user with many options
- A responsive sidebar with tabs just for Leaflet
- Synchronization of leaflet.js and google spreadsheet
- Qgis2web
Examples
-
Gallery
- Urban Mobility Fingerprint and Street DNA graphs
- Draw Your Own Election Adventure
- Heatmap
- Time Series Proportional Symbol Maps with Leaflet and jQuery
- Interactive and Multivariate Choropleth Maps with D3
- Student final project - Geography 575 spring 2017
- Madison Geography 575 Final Projects
- Plano Mutual Cemetery
- OpenRailwayMap
- Digital Observatory for Protected Areas (DOPA) Explorer 3.0
- Renewable energy simulations, ninja style
Tools
-
Useful tools for daily activity
Stack Overflow
Medium
Video
Filippo Maria Raeli
GIS Developer - Data Analyst - Web Design
My passion is learning the advances of modern technology and how to piece together a solution to every problem that I would like to expose myself to and be able to resolve different issues in difficult situations.