Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Leaflet + D3 Map

Public visualization

Viewing a saved revision (read-only)

9fad7fc1e5674308b4e949c05c333150

Leaflet + D3 Map

0 stars0🌍 Public
SShweta-tech
Last edited Nov 24, 2020
Created on Nov 24, 2020
Forked from Leaflet + D3 Map

This map combines Leaflet’s interactive tile layer with D3’s geographic projections to display hand-drawn lane polygons from the Worli neighborhood in Mumbai. It uses `L.map`, `L.svg`, and `L.tileLayer` to set up the map, then `d3.geoTransform` and `d3.geoPath` to project GeoJSON features from `polygon.js` onto the overlay pane. Area paths change fill color on `mouseover` and `mouseout`, and the `map.on('zoomend')` event calls `pathCreator` to redraw all paths with updated coordinates. The example demonstrates direct integration of D3-generated SVG geometries within a Leaflet canvas.

AI-generated description

Leaflet + D3 Map