Cali map json

100%

✓ Published0🌍 Public

Last edited Apr 2, 2021

Created on Apr 1, 2021

Forked from Multiple Views with Fast Brushing

This interactive visualization maps cumulative COVID-19 deaths across California counties, combining a bubble map with a brushable time-series histogram. The map projects county centroids using `d3.geoMercator`, while circle radii scale with total deaths via `d3.scaleSqrt`. The linked histogram aggregates daily deaths into monthly bins using `d3.histogram` and `d3.timeMonths`, with `d3.brushX` enabling temporal filtering that updates the map’s displayed bubbles. Data comes from a JHU CSSE time-series CSV and county boundaries from a TopoJSON file, rendered as SVG with React.

AI-generated description

A world map showing cities with population greater than 50,000. City data from Simplemaps: World Cities Database.

Country boundaries from World Atlas TopoJSON, polished for visual style, including graticules.

MIT Licensed

Similar vizzes

Loading thumbnail…

cali covid histo

This histogram visualizes COVID-19 deaths over time across all California counties, aggregated into monthly bins that show the total deceased and missing per month. Built with React and D3 v6, the chart uses `d3.histogram` with `timeMonths` thresholds to bin data, `scaleLinear` and `scaleTime` for axes, and SVG rect elements for bars. The data comes from the JHU CSSE COVID-19 time-series dataset, with each bin summing the daily death totals by county.

AAnthony Ynami

86% match

Loading thumbnail…

California Coronavirus Deaths Over Time

This chart displays cumulative COVID-19 death totals for each California county over time, with a Voronoi overlay enabling interactive hover detection. The logarithmic y-scale accommodates wide variations in county population sizes. Built with React and D3 v6, it uses `scaleTime`, `scaleLog`, `d3.Delaunay`, and SVG rendering. Data comes from the Johns Hopkins Coronavirus dataset, loaded via `d3.csv` and filtered for California counties.

AAnthony Ynami

80% match

Loading thumbnail…

Cali map

This map of California counties uses a Mercator projection from d3-geo to render land area and interior borders. The visualization displays county boundaries derived from a TopoJSON dataset of California, with the d3.geoPath and d3.geoMercator APIs converting geographic coordinates into SVG paths. React manages the component structure while d3.json and topojson's feature and mesh functions process the raw data, filling land masses in teal and stroke interiors in a lighter contrasting color.

AAnthony Ynami

79% match

Loading thumbnail…

CoronaVirus multiple view with brush

This interactive visualization combines a geographic bubble map with a time-series histogram to explore global COVID-19 death data. A brush on the histogram filters the map’s circles, which represent cumulative deaths per location. The map uses d3.geoNaturalEarth1 projection and d3.geoPath for landmasses, while the histogram employs d3.scaleTime and d3.histogram for binning. Data is loaded via d3.csv from the CSSEGISandData repository, and the React interface manages the linked brushing state.

AAmir

76% match

Loading thumbnail…

Los Angeles Exp

A choropleth map of Los Angeles County shows COVID-19 death rates by neighborhood, with gray indicating missing data. Built with React and D3 v5, it uses `geoEquirectangular` projection and `geoPath` to render TopoJSON boundaries alongside CSV data from County of LA eGIS. A threshold color scale maps death rates to a blue sequential scheme, while mouse hover events trigger neighborhood details, demonstrating layered data integration in an SVG.

MMatthew Talty Colvard

75% match

Loading thumbnail…

COVID Deaths Linked Views with Brushing

An interactive map of Georgia county-level COVID-19 death counts, where a linked time-series histogram below the map filters the displayed circles via brushing. The map uses `d3.geoNaturalEarth1` projection with `d3.geoPath` for world atlas landmasses, while circles are scaled by `d3.scaleSqrt` based on total dead and missing. The histogram uses `d3.bin` and `d3.brushX` to select date ranges, with React updating the filtered data in real-time. Data comes from a CSV of reported dates and coordinates.

Sshehrbano1248

75% match

Loading thumbnail…

Let's make a map

This interactive map visualizes COVID-19 case and death counts by country, with bubble sizes scaled to total cases and colors indicating severity. Users can zoom and pan using d3.zoom, while hovering over bubbles reveals detailed statistics via tooltips. The visualization combines a Natural Earth projection using d3.geoNaturalEarth1 and d3.geoPath, with geographic data loaded from the world-atlas TopoJSON and COVID-19 statistics from an external dataset. Countries are rendered as SVG paths with hover highlighting, and the animated bubble layer uses d3.scale.sqrt and linear color scales for proportional encoding.

Ssureshreddypr

74% match

Loading thumbnail…

California Counties

This example visualizes California counties with a map rendered using SVG and the D3.js v4 library. It loads county boundaries from a TopoJSON file and an earthquake feed from USGS, though only the county boundaries are drawn. The map uses a conic conformal projection via `d3.geoConicConformal` and `d3.geoPath`, with the projection fit to the state’s extent. Hovering over a county highlights it in crimson and displays its name and population in an overlay, using a mouseover event and the `d3.format` API.

MMTClass

74% match