Leaflet From Scratch With A GeoDjango Project

Explore how leaflet map controls enable users to switch base maps like OpenStreetMap standard and stadium maps, toggle overlays, and customize position, collapse, and styling.

Explore leaflet geolocation events by using map.locate to trigger location found and location error, then display a marker and radius circle with latitude, longitude, and accuracy.

Explore the Leaflet central class methods, including calculating distance between coordinates, and learn to create markers on click, manage coordinates in an array, and log the distance to the console.

Learn to implement Leaflet polylines, including continuous and multi polylines, using coordinate arrays and color options, and enable dynamic drawing with click events or the Leaflet draw plugin.

Enhance dynamic polyline drawing to support multiple polylines in Leaflet, finish with double clicks, manage latitude and longitude points, and convert the result to a JSON multi line string.

Extend Leaflet control to build a custom draw polygon plugin that toggles dynamic polygon drawing with a button, using onAdd, a factory function, and DOM utilities.

Enable dynamic polygon drawing in a Leaflet plugin by toggling a draw active state on click, turning red when active and white after double-click to stop drawing.

Load a json layer on a Leaflet map using get and same-origin options to show city names in popups, then filter by active and render circle markers with styling.

Learn how to style point features in Leaflet using mouse over and mouse out events to apply per-feature hover styles and reset to default, by targeting e.layer and set style.

Style polygons in leaflet by applying property-based colors for choropleth maps, using switch logic to color Austria red and Switzerland blue, and handling properties correctly.

Learn how to order layers in leaflet using bring to front and bring to back, ensuring cities sit above countries by placing the GeoJSON layer at the back.

Overlay video on a Leaflet map with L.videoOverlay, using a boundary and controls like autoplay and interactivity. The HTML video element provides play and pause within the layer.

Describe the web map service (WMS) standard and demonstrate using WMS in Leaflet with a tile layer, base URL, layers, formats, and get capabilities and get map.

Learn to create and display a WMS layer in leaflet with L.tileLayer.WMS, using a base URL, layers, png format with transparency, and a bounding box to focus on Australia.

Learn web feature service basics, including get capabilities and get feature, and consume WFS data in JSON with Leaflet by constructing requests for Australian coastal waters, comparing WFS and WMS.

Explains map projections as methods to represent earth on a flat surface, introduces three families—cylindrical, conical, planar—and distinguishes geographic from projected coordinate reference systems.

Learn to extend leaflet with Proj4Leaflet to display a Canberra aerial imagery WMS layer, configure CRS options, bounding box, and layer parameters, and center the map.

Explore the leaflet draw plugin to create and edit vector features on maps, including setup via CDN, CSS/JS assets, and event-driven integration with a feature group.

Explore how to cluster point data with the leaflet marker cluster plugin, including CDN or npm setup, initialize an L.markerClusterGroup, and use hover, zoom, and spider legs clustering.