CircleMap - Sars-Covid-2019

100%

CircleMap - Sars-Covid-2019

✓ Published0🌍 Public

Last edited Apr 8, 2021

Created on Apr 5, 2021

A world map uses proportional red circles to display confirmed SARS-CoV-2 cases per country, with circle size scaled by case count and a legend indicating magnitude. The visualization builds on a Natural Earth projection via `d3.geoPath`, loads CSV and TopoJSON data, and projects centroids with `d3.geoCentroid` to position circles. It employs `d3.scaleSqrt` for radius encoding, `d3.format` for tick labels, and `d3.zoom` for panning and zooming, rendering with SVG.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Circles on a Map

Circles on a Map visualizes COVID-19 confirmed cases by country as proportional circles overlaid on a natural Earth projection. Circle area encodes case counts via a square-root scale, and hovering highlights country boundaries with a tooltip showing the country name and case total. The visualization supports pan and zoom interactions. Built with D3 v5, it uses `d3.geoPath` with TopoJSON world data, `d3.geoCentroid` for circle placement, and a zoom behavior applied to an SVG group. Population data from the UN and case data from a CSV drive the marks.

Iinroadings

87% match

Loading thumbnail…

Circles on a map

This example visualizes confirmed COVID-19 cases as of August 30, 2020, using scaled circles positioned at country centroids on a natural Earth projection. It renders an SVG world map with d3.geoPath, applies a d3.scaleSqrt for circle radii, and includes interactive pan/zoom via d3.zoom. A color legend uses d3.scaleOrdinal with schemeSpectral, while a separate size legend displays tick marks. Data comes from a CSV time series and TopoJSON world atlas, processed with topojson.feature, with hover tooltips showing country names and case counts.

VVaggelisKlt

87% match

Loading thumbnail…

Circles on a map

This visualization displays confirmed COVID-19 cases per country on a world map, using a natural Earth projection from the topojson library. The map shows circles sized by the square root of case numbers, with a legend explaining the scaling. It uses d3.select, d3.geoPath, and d3.scaleSqrt for rendering, and supports interactive zooming. Data is loaded from a CSV file, and the map is rendered as SVG with hover tooltips showing country names and case counts.

EElena Dreosti

86% match

Loading thumbnail…

Circles on a Map

Animated circles on a natural Earth projection map visualize COVID-19 confirmed cases and deaths over time, with circle area encoding magnitude. Data is drawn from a temporal CSV and merged with country geometries loaded via TopoJSON. Hovering reveals population figures. Users can pan and zoom, while a color legend distinguishes levels. The visualization uses D3 v5 APIs including `geoPath`, `geoNaturalEarth1`, `scaleSqrt`, `zoom`, and transitions.

Iinroadings

86% match

Loading thumbnail…

Circles on a map

This map visualization displays the total confirmed COVID-19 cases per country as of May 16, 2020, using red circles sized proportionally to case counts overlaid on a world map. The geographic boundaries are drawn using `d3.geoPath` with a `geoNaturalEarth1` projection, while circle radii are scaled with `d3.scaleSqrt`. Data comes from a CSV file of country-level COVID-19 statistics, joined to the world-atlas TopoJSON, and is processed via custom `loadAndProcessData` functions. A size legend and color legend are rendered using SVG.

Yyakupermurat

86% match

Loading thumbnail…

Circles on a map

This visualization displays the global distribution of total COVID-19 cases as of August 30, 2020, using proportional red circles overlaid on a natural Earth projection map. The map is rendered with SVG, using d3.geoPath for country outlines and d3.geoCentroid to position each circular marker. Circle radii are scaled with d3.scaleSqrt, while a color legend uses d3.scaleOrdinal with a spectral scheme to categorize data. Interactive zooming is enabled through the d3.zoom module, and data is loaded from a CSV file and TopoJSON world atlas using d3.csv and topojson.feature.

VVaggelisKlt

86% match

Loading thumbnail…

Circles on a Map

This visualization displays the global distribution of new COVID-19 cases using proportional circles positioned by country centroids on a natural Earth projection. The circle areas encode population data loaded from CSV files, while tooltips reveal exact values on hover. Built with D3 v5, the visualization uses d3.geoPath for map rendering, d3.geoCentroid for positioning, d3.scaleSqrt for circle sizing, and d3.zoom for pan and zoom interactions. A size legend with d3.ticks communicates the scale, and world atlas TopoJSON provides the country boundaries.

YYIN Wanxuan

85% match

Loading thumbnail…

Circles on a map

This example displays total COVID-19 cases per country on a natural Earth projection map, using red circles scaled by case count and a legend for reference. It loads data from a GitHub CSV and world-atlas TopoJSON via `d3.csv` and `topojson.feature`, then projects centroids with `d3.geoCentroid` and `d3.geoNaturalEarth1`. The visualization is built with React and rendered as SVG, using `d3.scaleSqrt` for circle sizing, `d3.scaleOrdinal` with `schemeSpectral` for the color legend, and custom `sizeLegend`/`colorLegend` components.

VVaggelisKlt

85% match