CORONA Live chart

100%

CORONA Live chart

✓ Published1🌍 Public

Last edited Feb 6, 2022

Created on Feb 1, 2022

The CORONA Live chart displays the cumulative global death toll from COVID-19 over time as a single black line, with a horizontal marker at one million deaths and a vertical marker at the latest date. It renders as an SVG using React components and D3 v5 scales (`scaleTime`, `scaleLinear`) and a `line` generator. Data is loaded via `d3.csv` from the Johns Hopkins CSSE time-series dataset, aggregated daily by summing death counts across all countries.

AI-generated description

Smiley face implementation with React & D3, taking full advantage of React components and ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

CORONA Live chart React + d3 axes

This chart shows the global cumulative number of COVID-19 deaths over time, with the line rising sharply as the pandemic progresses. The visualization uses React components for structure and D3 v5 scales, axes, and line generator for the SVG rendering. A horizontal marker line highlights the one-million-death threshold, while a vertical marker indicates the latest date. Data comes from a CSSE time-series CSV, which is fetched and aggregated using d3.csv and d3.timeParse. Custom XAxis and marker components leverage d3.axisBottom and React refs for drawing gridlines.

KKolezhannochka

92% match

Loading thumbnail…

Corona Deaths Live Table

This line chart tracks global cumulative COVID-19 deaths over time, using a log-scaled y-axis to accommodate exponential growth. Data is sourced from the Johns Hopkins COVID-19 dataset via a CSV fetch with `d3.csv`, processed into daily totals, and rendered as an SVG path using `d3.line`, `d3.scaleTime`, and `d3.scaleLog`. React manages the component lifecycle, while `d3.axisBottom` and `d3.axisLeft` generate gridlines and tick labels.

Nnexus1058

92% match

Loading thumbnail…

CoronaVirus Line Chart

A line chart displays the cumulative global death toll from COVID-19 over time, based on data from the CSSE at Johns Hopkins University. The chart marks the most recent date with a vertical “now” line and highlights thresholds at one and two million deaths with horizontal reference lines. Built with React and D3 v5, the visualization uses `scaleTime` and `scaleLinear` for axes, and `d3.line` to generate the SVG path from a dataset transformed from CSV by summing daily death totals across all countries.

33ssalunke

90% match

Loading thumbnail…

Corona Virus Line Chart

This line chart visualizes the cumulative death toll from COVID-19 over time, with a single black line tracing the global trend. A horizontal marker at 10,000 and a vertical marker at the latest date provide visual reference points. Built with React and D3 v7, the chart uses `scaleTime`, `scaleLinear`, and a `line` generator to plot data from a CSSE GitHub CSV. The SVG rendering includes custom marker components for the annotations, and data is loaded asynchronously via `d3.csv`.

SSerind Joshua McCue

89% match

Loading thumbnail…

CoronaVirus Line Chart

This visualization displays the global cumulative death toll from COVID-19 over time as a single black line chart. It uses a React component with D3 v5 scales (`scaleTime`, `scaleLinear`) and a `line` generator to plot data from the JHU CSSE COVID-19 time series dataset. Dashed horizontal markers label key thresholds (10,000 to 2,000,000 deaths) via a custom `YMarkerLine` component, which draws SVG `<line>` elements and formatted text labels. The chart fills the browser window and updates when new data is loaded.

AAmir

89% match

Loading thumbnail…

Corona Deaths Linechart with Marker Line

The chart displays global cumulative COVID-19 deaths over time as a thick black line, with a red horizontal marker line fixed at 3 million deaths. Built using React and D3 v5, it renders an SVG path via `d3.line()` with time and linear scales (`scaleTime`, `scaleLinear`). The line’s y-coordinate is derived from the `deathTotal` field, which sums daily death counts from the JHU CSSE time-series CSV. The marker line’s position is computed using the same y-scale, and both elements are drawn directly in the JSX.

Nnexus1058

89% match

Loading thumbnail…

Corona Virus LineChart

This example shows the global total COVID-19 deaths over time as a single black line chart, with a horizontal marker line at six million deaths. The data comes from the CSSE COVID-19 time series CSV, aggregated daily across all countries. Built with React and D3 v5, it uses `scaleTime`, `scaleLinear`, and `line` to map dates and death totals to SVG coordinates, while the marker line is drawn with a simple SVG `<line>` element at a fixed y-value.

SShanmukh

89% match

Loading thumbnail…

Cororona Virus Line Chart

This chart displays the global death toll from COVID-19 over time, using a line chart that currently renders as an empty red SVG canvas. The visualization pulls time-series data from the CSSE at Johns Hopkins University via a CSV file, processed with d3’s `csv` loader. The React component structure uses `useData` to fetch the dataset, while the SVG is sized to the full browser window. The code is built with React 16.9, D3 v6, and renders through the `svg` element, though no lines are actually plotted yet.

AAndres de la Garza

88% match