Skip to main content
SimilarExport ZIP
100%

NYC Crash Point Map with interactive legend

✓ Published0🌍 Public
JJose Morales
Last edited Oct 23, 2025
Created on Oct 23, 2025

This interactive map displays motor vehicle crash locations across New York City's five boroughs, with each borough filled with a distinct color. A legend allows users to hover over borough names, fading non-selected areas to highlight crash density in a specific region. The visualization uses React with d3.geoMercator and d3.geoPath to project TopoJSON boundary data from `nyc_boroughs.topo.json` into SVG paths. Crash points from a CSV file are rendered as small black circles, with positions calculated via the projection function.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

NYC Crash Point Map with interactive legend

A map of New York City displays crash locations as small black dots over borough polygons, each tinted with a distinct color. An interactive legend lets users hover over a borough name to highlight its corresponding region and dim others. Built with React and D3, the visualization uses `d3.geoMercator` and `d3.geoPath` to project and render the TopoJSON-derived borough boundaries, while crash coordinates from a CSV file are plotted as SVG circles. Hovering a legend item dims non-matching boroughs and intensifies crash point opacity for the selected area.

JJose Morales
98% match
Loading thumbnail…

NYC Crash Point Map

This visualization displays a map of New York City's five boroughs with individual crash points from 2025 overlaid as small black circles. The map uses d3.geoMercator and d3.geoPath to render TopoJSON-converted GeoJSON borough boundaries, colored distinctly via a React legend. Crash coordinates from the NYC Motor Vehicle Collisions CSV are projected onto the map. The visualization is built with React, d3.v7, and renders to SVG, with responsive sizing and crash data loaded via a custom React hook.

JJose Morales
95% match
Loading thumbnail…

NYC borough map with interactive legend

An interactive map of New York City's five boroughs displays traffic crash counts from a CSV dataset as circular markers with numeric labels, overlaid on a TopoJSON-derived GeoJSON map. Users hover over legend items or borough polygons to highlight matching regions while dimming others. The visualization uses React for component state and layout, D3 v7's `geoMercator` and `geoPath` for the map projection, and `select` for SVG updates. A semi-transparent legend communicates the fixed borough color scheme.

JJose Morales
91% match
Loading thumbnail…

Interactive NYC Borough map

An interactive map of New York City's five boroughs, colored distinctly, serves as a base for exploring traffic crash data. Users toggle checkboxes in a legend to display layers of colored points representing injured or killed cyclists, pedestrians, and motorists. The map shows these incident locations as colored circles at varying opacities. Hovering over a borough reveals a tooltip with summary crash statistics. Built with React, it uses D3's `geoMercator` for projection, `geoPath` for drawing, and `topojson-client` for handling geographic data, visualizing point data loaded from CSV files.

JJose Morales
90% match
Loading thumbnail…

Interactive NYC Borough map

This interactive map of New York City’s five boroughs visualizes traffic crash statistics, distinguishing injury and fatality counts for cyclists, pedestrians, and motorists. A legend allows users to toggle six incident categories on and off, revealing colored point markers for each crash location. The map renders boroughs as colored SVG paths using `d3.geoMercator` and `d3.geoPath`, with data loaded from CSV files via `fetch`. Hovering over a borough displays aggregated crash counts from `CrashByBorough.csv` in a tooltip.

JJose Morales
90% match
Loading thumbnail…

Interactive NYC Borough map

This interactive map of New York City’s five boroughs visualizes traffic crash statistics, distinguishing injury and fatality counts for cyclists, pedestrians, and motorists. A legend allows users to toggle six incident categories on and off, revealing colored point markers for each crash location. The map renders boroughs as colored SVG paths using `d3.geoMercator` and `d3.geoPath`, with data loaded from CSV files via `fetch`. Hovering over a borough displays aggregated crash counts from `CrashByBorough.csv` in a tooltip.

JJose Morales
90% match
Loading thumbnail…

NYC Borough map

This map of New York City boroughs uses distinct colors for each borough, with semi-transparent circles and white text labels displaying the number of motor vehicle crashes per borough. The visualization loads TopoJSON geographical data and CSV crash statistics, then renders them as an SVG using React, D3’s `geoMercator` and `geoPath` projections, and `topojson-client`’s `feature` conversion. Circle radius is determined by the digit count of crash totals, providing a quick comparison of crash frequency across the five boroughs.

JJose Morales
89% match
Loading thumbnail…

Interactive NYC Borough map with scroll and zoom

An interactive map of New York City's five boroughs colored by name, with an optional overlay of incident points. Across each borough, users can toggle visibility for six crash-related categories—cyclists, pedestrians, or motorists, each further split into injured or killed—using checkboxes or clicks in the legend. The React app loads data from CSV files for incident locations and a TopoJSON file for borough boundaries, rendering with D3's Mercator projection and `geoPath`. Hovering over a borough displays a tooltip with aggregate crash statistics from a separate CSV.

JJose Morales
88% match