Untitled

100%

✓ Published0🌍 Public

Nnellylopez2022

Last edited May 24, 2022

Created on May 24, 2022

An interactive choropleth map displays property crime rates across U.S. states from 2009 to 2019, with dropdown menus to select the year and crime type (property crime, burglary, larceny, or motor vehicle theft). The map uses `d3.geoAlbersUsa` projection and `d3.geoPath` to render state boundaries from a TopoJSON file. Crime values are mapped to a red color scale using `d3.scaleThreshold`, with a legend generated via `d3.legendColor`. Hovering over a state reveals a tooltip with details, and the visualization updates dynamically through SVG transitions.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

A choropleth of the United States visualizes violent crime rates per state from 1999 to 2019. The map uses SVG circles positioned via `d3.geoAlbersUsa` and `d3.geoPath` to represent state-level crime counts, with circle size and color encoded through `d3.scaleLinear`. Users select a year and crime type (e.g., homicide, robbery) from dropdown menus, triggering a redraw of the map with updated data. The visualization loads state geometries from `us-states.json` and coordinates from `states_lon_lat.json`, with data from the `estimated_crimes_1999_2019.csv` file.

OOsasotur

89% match

Loading thumbnail…

Untitled

This interactive map visualizes violent crime rates across U.S. states from 1999 to 2019, with dropdown menus to select the year and crime type. Circles sized and colored by bivariate linear scales (d3.scaleLinear) are overlaid on a U.S. map projected using d3.geoAlbersUsa with d3.geoPath. The visualization uses d3.json to load state boundaries and coordinates, with hover tooltips showing state names and values.

Aajeuphoria

89% match

Loading thumbnail…

Untitled

This visualization plots U.S. state-level crime statistics, showing violent crime totals against homicide cases for each state, with bubble size encoding population and color assigned by state name. The chart uses d3.v4 with d3-scale-chromatic for color mapping and includes an interactive tooltip that displays the state name on hover, while also fading out non-hovered bubbles. Data comes from the estimated_crimes.csv file, rendered as SVG circles with axes and labels generated using d3.axisBottom and d3.axisLeft.

Ssruthisenapathi

82% match

Loading thumbnail…

Untitled

This choropleth map of the United States visualizes the legal status of a substance in each state, with colors ranging from red to green based on a five-point scale. The visualization also plots cities as circles, with their size representing the number of years lived there, and includes interactive tooltips that appear on hover. The map is rendered using D3 version 3 with an Albers USA projection, loading geographic data from a GeoJSON file, state statuses from a CSV, and plotting city coordinates through the same projection.

Ggcappadaniel

81% match

Loading thumbnail…

Chicago Crime Data First Pass

This visualization maps Chicago crime data as red points on a U.S. state map using the Albers USA projection via `d3.geoAlbersUsa` and `d3.geoPath`. It loads TopoJSON state boundaries and CSV crime coordinates, rendering circles with tooltips that display the crime type on hover. Zooming and panning are enabled with `d3.zoom`. Points animate with a `transition` and scale transform, while SVG styling uses a custom tooltip div.

MMengmeng Yu

81% match

Loading thumbnail…

Untitled

This choropleth map of the United States displays state-level COVID-19 case values with a green color scale, using lighter shades for lower numbers and darker greens for higher ones. The visualization loads CSV data and merges it with GeoJSON state geometries using d3.csv and d3.json, then renders paths with d3.geoPath and the d3.geoAlbersUsa projection. A d3.scaleQuantize maps numeric values to a five-color range, while states lacking data appear gray. The SVG is built with D3 v7 and styled with minimal CSS.

Jjoslinl

79% match

Loading thumbnail…

Untitled

This interactive map of the United States uses a D3.js geographic projection to display state boundaries, rendered as SVG paths from TopoJSON data. Clicking a state zooms in via a smooth `transition` that adjusts the group’s scale and translate attributes, while the clicked state is highlighted in orange. A click on the background resets the view, returning the map to its original scale and stroke width. The example relies on `d3.geo.albersUsa`, `d3.geo.path`, and TopoJSON’s `feature` and `mesh` methods.

CChase Hall

79% match

Loading thumbnail…

Untitled

A choropleth map of the United States displays county-level poverty rates, colored with a threshold scale using a green sequential scheme. The visualization includes a legend with a color bar and labeled ticks. The code uses D3 v5 and the `d3.geoPath` and `d3.scaleThreshold` APIs, along with TopoJSON for US county boundaries and a CSV data file for the rates.

IIsha Singh

79% match