Skip to main content
SimilarExport ZIP
100%

Coronav deaths line chart

✓ Published1🌍 Public
Ssurikmeetr
Last edited Apr 17, 2021
Created on Apr 16, 2021

This chart displays the total global COVID-19 deaths over time as a single black line rising across a white SVG canvas, with a teal horizontal marker line fixed at the one-million death threshold. The React component uses d3’s `scaleTime`, `scaleLinear`, and `line` generator to map dates and cumulative death totals from the CSSE COVID-19 time series dataset (a CSV loaded via d3.csv). The marker line’s position is computed with `yScale(1000000)`, while the path is rendered directly to SVG coordinates.

AI-generated description

React + D3 to display coronav line chart

MIT Licensed

Similar vizzes

Loading thumbnail…

Coronav deaths line chart 2 margin convention

A line chart tracks cumulative global COVID-19 deaths over time, with horizontal reference lines at one, two, and three million deaths and a vertical "now" marker at the latest date. The chart uses React with D3 v6, employing `scaleTime`, `scaleLinear`, and `line` to map dates and death totals, with margins applied via an SVG `<g>` transform. Data comes from the CSSE COVID-19 time series CSV, processed with `csv` and `timeParse` to aggregate daily global totals.

Ssurikmeetr
93% match
Loading thumbnail…

Fork of CORONAVIRUS LINE CHART

This chart displays global COVID-19 death totals over time using a red SVG background and a thick black line. It uses `d3.scaleTime` and `d3.scaleLinear` to map dates and cumulative deaths, while `d3.line` generates the path. Two custom React components, `YMarkerLine` and `XMarkerLine`, draw reference lines at the 1,000,000 death mark and at the latest date, respectively. Data comes from the CSSE COVID-19 time series CSV loaded via `d3.csv`.

Jjesramyep1263
91% 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
91% match
Loading thumbnail…

Coronavirus Line Chart

The chart displays the cumulative global death toll from COVID-19 over time as a single black line, with a horizontal marker line indicating the 10,000-death threshold. Built with React and D3 v7, it uses `scaleTime` and `scaleLinear` to map dates and totals, while a `line` generator produces the SVG path. The data is fetched from the CSSE COVID-19 time series CSV, aggregated daily by summing deaths across all countries.

Ccynichole
91% match
Loading thumbnail…

Coronavrius Line Chart with marker line

A line chart tracks cumulative global COVID-19 deaths over time, using a black marker line to highlight the point where the death toll reaches three million. The visualization loads time-series data from the Johns Hopkins CSSE repository via `d3.csv`, transforms dates with `d3.timeParse`, and renders an SVG path generated with `d3.line`. Scales are created with `d3.scaleTime` and `d3.scaleLinear`, while React manages the component state and updates the chart.

Jj-PGi
91% match
Loading thumbnail…

Coronavirus Line Chart with Marker Line

This visualization displays global COVID-19 death totals over time as a single bold line, with a horizontal marker line highlighting the one-million-death threshold. The React component uses d3.scaleTime and d3.scaleLinear to map dates and cumulative deaths to SVG coordinates, while d3.line generates the path. Data comes from the CSSEGISandData COVID-19 time-series CSV, loaded via d3.csv and aggregated daily. The marker line is a static SVG `<line>` positioned using the y-scale’s output for one million deaths.

RRMartins11
91% match
Loading thumbnail…

Coronavirus Basic Line Chart With 5,000,000 Marker Line

This chart shows the global cumulative COVID-19 death toll over time, rendered as a black line that climbs steadily across the full window. A horizontal marker line at 5,000,000 deaths highlights when the total crossed that threshold. Built with React and D3 v7, it uses `scaleTime` and `scaleLinear` to map dates and death totals, while `line()` generates the SVG path from data fetched from the CSSE COVID-19 time series. The marker line is a simple SVG `<line>` positioned via the y-scale.

KK3zter
91% match
Loading thumbnail…

Coronavirus Line Chart With 5,000,000 Marker Line

A line chart displays worldwide cumulative COVID-19 deaths over time, with a horizontal marker line highlighting the 5,000,000 death milestone. The chart uses a React component with D3’s `scaleTime`, `scaleLinear`, and `line` generator to map dates and death totals to SVG coordinates. The marker line is positioned using `yScale(5000000)`. Data comes from the CSSEGISandData COVID-19 time series CSV, aggregated by summing daily global deaths. The SVG renders the trend as a black stroke and the threshold as a thinner line, filling the browser viewport.

TThomas Cormican
91% match