new data with json

100%

new data with json

✓ Published0🌍 Public

Last edited Dec 6, 2022

Created on Dec 6, 2022

Forked from new data

This choropleth map displays county-level ozone concentrations across the United States from 2000 to 2021. A vertical slider and play button animate through years, with the sequential YlGnBu color scale mapping ozone levels while gray indicates missing data. Built with React and D3 v5, it uses `geoPath` with an Albers USA projection and TopoJSON county/state boundaries, rendering SVG paths with hover tooltips showing county names and values.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

new data

A choropleth map of U.S. counties shows ozone levels for each year from 2000 to 2021, with a vertical slider and play button to animate through time. County colors use a sequential yellow-green-blue scale, while state boundaries are drawn as thin lines. Built with React and D3 v5, it uses `geoPath` with a fitted Albers projection, a TopoJSON atlas, and a Map lookup from CSV data. Hovering a county reveals its name and ozone value.

CChase Hall

95% match

Loading thumbnail…

new data with json

This example displays a choropleth map of U.S. counties, colored by yearly data values from 2000 to 2021. A vertical slider with a play button animates through years, updating the fill colors with a sequential scale. The map is rendered as SVG paths using d3.geoPath with geoIdentity projection, based on TopoJSON data from the us-atlas library. Hovering reveals county names, state abbreviations, and the current value via SVG titles, while state borders are drawn as a mesh overlay.

CChase Hall

88% match

Loading thumbnail…

Fork of new data

This interactive choropleth map shows annual PM2.5 air pollution levels across U.S. counties from 2000 to 2021, with a slider and play button animating through years. County polygons are colored using d3.scaleSequential with a reversed YlGnBu interpolator, while uncolored areas appear grey. The visualization uses React hooks for state management, d3.csv for data loading, topojson.feature for county and state boundaries, and d3.geoPath with geoIdentity projection for rendering SVG paths. State borders are drawn as a separate mesh layer, and tooltips display county names and values.

CChase Hall

82% match

Loading thumbnail…

Fork of Fork of new data

This interactive choropleth map displays annual PM2.5 air pollution levels across U.S. counties from 2000 to 2021, with users scrubbing a vertical slider or clicking "play" to animate through years. State boundaries remain visible while county fill colors shift along a sequential YlGnBu scale, with gray representing missing data. Built with React and React hooks, the visualization uses d3.csv, d3.json, and topojson to load data and county geometries, then renders SVG paths via d3.geoPath and geoIdentity. A rotating slider and datalist labels enable temporal exploration.

CChase Hall

82% match

Loading thumbnail…

more chloropleth

This interactive choropleth maps fine particulate matter (PM2.5) concentrations across U.S. counties from 2000 to 2021, with a slider and play button animating through years. Each county’s fill color transitions smoothly via `scaleSequential` and `interpolateYlGnBu`, while hovering reveals state and value details. Built with React and D3 v5, it uses `geoIdentity` with `geoPath`, TopoJSON from the us-atlas library, and CSV data fetched via `d3.csv`, rendering SVG paths that update with `transition` styling.

EElijah D'Aran

81% match

Loading thumbnail…

Pollution in US with counties by React and d3

This interactive choropleth visualizes PM2.5 pollution levels across US counties from 2000 to 2018. Users can drag a vertical slider or press a play button to animate through years, with county colors transitioning smoothly via the sequential `d3.interpolateYlGnBu` scale. Built with React and D3 v5, it uses `d3.geoPath` and `geoIdentity` projection to render county boundaries from the US Atlas TopoJSON, while county pollution data is loaded from a CSV and mapped to each feature. The legend displays the concentration range, and hovering over a county reveals its name and value.

Ggeorgeeeee

80% match

Loading thumbnail…

new fork

This interactive choropleth displays PM2.5 air pollution concentrations across US counties, with a color gradient from light to dark blue indicating higher values, alongside a slider to animate through years 2018–2021. Built with React and D3 v5, it uses `d3.geoPath` with a `geoIdentity` projection to render county and state boundaries from TopoJSON, while `d3.scaleSequential` with `interpolateBlues` maps data values to fill colors. A play button triggers a JavaScript interval that advances the year, updating the rendered SVG paths and the static color legend.

PPavan Nimmagadda

80% match

Loading thumbnail…

Pollution Around America and Over Time

A choropleth-free bubble map displays air quality index measurements across the United States, with circles overlaid on state boundaries rendered via `d3.geoAlbersUsa` and `d3.geoPath`. A brushed time-series histogram beneath the map uses `d3.brushX` and `d3.bin` to filter the circles by collection date, updating the map dynamically. Data comes from a CSV of ozone readings, while state outlines derive from TopoJSON via the `feature` and `mesh` APIs. SVG elements render all visuals within a React framework.

CChase Hall

79% match