Circle Map - Coronavirus PT.2

100%

Circle Map - Coronavirus PT.2

✓ Published0🌍 Public

Last edited Apr 4, 2021

Created on Apr 4, 2021

The visualization displays the cumulative confirmed COVID-19 cases per country from January to June 2020, shown as a circle map where each circle’s size corresponds to case counts. It uses D3 v5 to load and process CSV data, parsing dates and summing confirmed cases by year and country. The rendering is SVG-based, with styled tick marks and circles drawn using D3's time formatting and CSV parsing APIs.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Circle Map - Coronavirus

A circle map visualizes the global spread of the coronavirus pandemic, plotting each country as a circle sized by its confirmed case count. The visualization uses D3.js (version 5) to render SVG circles on a map, with the data loaded from a local CSV file containing daily country-level statistics for confirmed cases, recoveries, and deaths. The map appears to show the progression over time, with each circle's position likely representing a geographic location and its area scaled to the number of confirmed infections.

Ppplomith

91% 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 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

85% match

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

85% 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

84% match

Loading thumbnail…

Circles on a Map

This visualization presents daily COVID-19 case data as an animated, zoomable map. Teal circles sized by confirmed cases and red circles for deaths appear over each country, with a date ticker and hover tooltips providing detail. Built with D3.js (v5), it uses `geoPath` and a Natural Earth projection, animating circle radii via `transition()`. Population data comes from a CSV file (`data01.csv`) and country shapes from the VisionsCarto World Atlas TopoJSON.

Iinroadings

83% match

Loading thumbnail…

Fork of Circles on a map

This visualization displays total COVID-19 cases by country as of August 30, 2020, using red circles sized with d3.scaleSqrt and positioned via d3.geoCentroid and d3.geoNaturalEarth1 projection. The map employs d3.geoPath for country outlines and includes interactive zoom via d3.zoom. A color legend and size legend are rendered as SVG components using React, with data loaded from a CSV time series and TopoJSON world atlas. Hovering reveals country names and case counts through SVG title elements.

JJean David

83% match

Loading thumbnail…

Fork of Circles on a map

This example displays the total COVID-19 cases per country as of August 30, 2020, using circles sized by a d3.scaleSqrt on a world map. The map is rendered with d3.geoPath and a geoNaturalEarth1 projection, while country boundaries come from TopoJSON world-atlas data. Hovering highlights countries, and a size legend with a color legend—built via custom legend components—explains the scaling. The visualization supports zooming and panning through d3.zoom, with SVG circles positioned using d3.geoCentroid and the projection.

TTacue

83% match