CovidCases

Last edited Apr 24, 2025

Created on Apr 24, 2025

This visualization shows the cumulative number of COVID-19 cases in Sweden, Denmark, and Norway over time, displayed on a geographic map of Scandinavia. A date slider lets viewers scrub through the timeline, with each country colored according to a sequential orange-red scale that encodes case counts. The implementation uses d3-geo and d3.geoPath with a Mercator projection to render the map, while d3.scaleSequential and d3.interpolateOrRd handle the color mapping. Data comes from a JSON world geometry file and a CSV of daily case totals, grouped by date and country. Hovering over a country reveals a tooltip, though its text is not populated.

AI-generated description

MIT Licensed

Similar vizzes

Fork of CovidCases

This example shows a choropleth map of COVID-19 total cases across Sweden, Denmark, and Norway over time, with a slider to scrub through the available dates. The map uses SVG paths rendered with `d3.geoPath` and a Mercator projection fitted to geographic data from a world GeoJSON file. Each region’s fill color is driven by a `d3.scaleSequential` with `d3.interpolatePlasma`, mapping case counts from a CSV dataset. A tooltip is attached to the paths via mouse events, though it is referenced but not fully instantiated in the provided code, and the slider updates the displayed date label.

85% match

Both Charts

This visualization presents two line charts showing COVID-19 case counts in five Scandinavian countries throughout October 2020. One chart uses a linear scale while the other displays the same data on a logarithmic scale, highlighting the different visual patterns each scale produces. Built with D3 v7, the code uses `d3.csv` to load data, `d3.scaleLinear` and `d3.scaleLog` for the axes, and `d3.line` to generate the SVG paths. Each country’s daily cases are plotted against the day of the month, with axes styled using `d3.axisBottom` and `d3.axisLeft`.

79% match

Heatmap in D3

This heatmap visualizes monthly COVID-19 cases across Scandinavian countries for 2020, using a blue sequential color scale to encode case counts per country-month combination. The SVG chart, built with D3 v7, reads CSV data from a GitHub gist and renders axes, labels, and tooltips. It uses `d3.scaleBand` for positioning, `d3.scaleSequential` with `d3.interpolateBlues` for coloring, and the d3-legend plugin for the color legend.

79% match

Black hat multiline chart

This example displays daily COVID-19 cases for five Scandinavian countries throughout October 2020 on a logarithmic scale. The black-background chart uses colored lines for Sweden, Denmark, Norway, Finland, and Iceland. The visualization loads CSV data via `d3.csv`, builds scales with `scaleLinear` and `scaleLog`, and renders paths with the `d3.line` generator. SVG elements handle axes, labels, a title, and a legend, demonstrating D3 v7's data-joining and axis APIs.

Fork of Line Chart - Covid Cases per day in Sweden October 2020

This line chart tracks daily COVID-19 cases in Sweden during October 2020, with a shaded area under a monotone-smoothed curve, interactive hover points that reveal tooltips with exact values, and a dashed red line marking the average case count. The visualization also annotates the peak case day. Built with D3 v7, it uses SVG paths for the line, area, and axes, while d3.csv loads the external data and d3.scaleTime and d3.scaleLinear map dates and case numbers to positions. Responsive dimensions and hover transitions enhance the interactive experience.

NNita

Line Chart - Covid Cases per day in Sweden October 2020

This line chart shows the number of daily COVID-19 cases in Sweden for October 2020, with the day of the month on the x-axis and case count on the y-axis. The chart is rendered as an SVG using D3.js v7, loading data from a CSV file. The code creates linear scales for both axes, draws the axes with gridlines, and generates a steelblue line path via `d3.line()`. Axes and chart titles are added as SVG text elements, and the visualization automatically sizes to the browser window.

TESTER

This interactive dashboard visualizes social and economic indicators for Scandinavian countries from 2020 to 2024, displaying GDP annual change, unemployment rates, and hospital occupancy for Denmark, Norway, and Sweden. Three separate line charts show each country's hospital occupancy, while a combined chart aggregates the data for comparison. The visualization uses D3.js to create SVG line charts with hover tooltips and interactive legends that highlight or fade individual country lines. Users can click legend items to filter specific countries across the economic indicators, with hover tooltips revealing exact values for each data point.

Mortality Scatterplot

This scatterplot visualizes COVID-19 deaths per 10 million people across Denmark, Norway, and Sweden over time, with each country color-coded and a slider allowing users to scrub through dates. The chart draws trailing paths behind each data point to show temporal progression, and hovering reveals a tooltip with details. Built with D3 v7, it uses `d3.csv` to load data, `d3.group` to organize by country, and `d3.scaleTime`/`d3.scaleLinear` for axes, with SVG circles for points and an HTML range input for animation.