Skip to main content
SimilarExport ZIP
100%

Fork of Coronavirus Line Chart with 1M marker line

✓ Published1🌍 Public
KKevin McMorrow
Last edited Dec 16, 2021
Created on Dec 16, 2021

This line chart tracks global cumulative COVID-19 deaths over time, using data from the CSSE at Johns Hopkins. It plots a bold black line and overlays a horizontal marker at the 1,000,000 death threshold, plus a vertical marker at the latest date labeled “now.” Built with React and D3 v7, it uses `scaleTime`, `scaleLinear`, and the `line` generator, rendering as SVG. The `YMarkerLine` and `XMarkerLine` components draw the reference lines and labels.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Coronavirus Line Chart with Marker Line

A line chart visualizes the global cumulative COVID-19 death total over time, with a vertical marker line at the most recent date and a horizontal marker line at the one-million-death threshold. The chart uses React and D3 v5 (including `scaleTime`, `scaleLinear`, and `line`) to render an SVG path from CSV data sourced from the COVID-19 Data Repository. Marker lines are drawn as SVG elements via custom components, and the chart updates with the latest available daily data.

RRMartins11
93% match
Loading thumbnail…

Fork of Coronavirus Basic Line Chart With 10,000 Marker Line

A line chart tracks cumulative global COVID-19 deaths over time, with a horizontal marker line at 10,000 deaths. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, and `line` generators to map dates and death totals, rendering an SVG path with a thick black stroke. The marker line is drawn as a separate SVG `<line>` element, while the React component structure (via `useData`) loads the Johns Hopkins CSSE time-series CSV, aggregating daily death sums. The X-axis is delegated to a separate component using `d3.select`.

KKonJoDot
93% match
Loading thumbnail…

Fork of Coronavirus Line Chart With 5,000,000 Marker Line

A line chart tracks global cumulative COVID-19 deaths over time from JHU CSSE time-series data, using d3.scaleTime and d3.scaleLinear. A horizontal YMarkerLine highlights the 5,000,000 death threshold, while an XMarkerLine marks the most recent date. The SVG path is generated with d3.line, rendered in React, and updated to the full viewport size.

TThomas Cormican
93% match
Loading thumbnail…

Coronavirus Line Chart with 1M marker line

This chart shows the global cumulative COVID-19 death toll over time, with a horizontal marker line at the one-million-death threshold. The line chart uses d3.scaleTime for dates, d3.scaleLinear for deaths, and d3.line to generate the path. A horizontal `line` element is positioned using the y-scale’s value for 1,000,000. Data comes from the CSSE COVID-19 time series CSV, aggregated daily across all countries, and renders as an SVG in a React component.

KKevin McMorrow
92% match
Loading thumbnail…

Coronavirus Line Chart With 1M Marker

A line chart tracks cumulative COVID-19 deaths worldwide over time, using data from the Johns Hopkins Coronavirus Dataset. A horizontal black marker line highlights the point where total deaths reach one million. The visualization is built with React and D3 v5, employing `scaleTime`, `scaleLinear`, and `line` to generate the SVG path, while a separate `<line>` element marks the one-million death threshold. Data is loaded via `csv` and transformed by summing daily death totals across all countries.

CChris Briggs
92% match
Loading thumbnail…

Coronavirus Basic Line Chart with 1,000,000 Marker Line

This line chart displays the cumulative global death toll from COVID-19 over time. A horizontal marker line at 1,000,000 deaths and a vertical marker at the most recent date highlight key thresholds. The chart uses D3’s `scaleTime`, `scaleLinear`, and `line` to generate the SVG path from the CSSE COVID-19 time-series data, while React renders the visual and the custom `YMarkerLine` and `XMarkerLine` components draw the annotations.

BBen Brophy
92% match
Loading thumbnail…

Coronavirus Line Chart w/ 1M Marker

This chart depicts the cumulative global death toll from COVID-19 over time, using data from the Johns Hopkins Coronavirus Dataset. A thin horizontal line marks the point where deaths reach one million, while a thick black path traces the rising trend. The visualization is built with React and D3 v6, using `scaleTime`, `scaleLinear`, and `line` to generate an SVG path. Data is loaded via `d3.csv` and processed by summing daily country-level death counts.

AAnthony Ynami
92% match
Loading thumbnail…

Coronavirus Line Chart with Marker Lines Part I

This line chart displays global cumulative COVID-19 deaths over time from the Johns Hopkins dataset, with a horizontal marker line at the one-million-death threshold. The React component uses D3 v6 functions `scaleTime`, `scaleLinear`, `extent`, `max`, and `line` to construct an SVG path. Data loading relies on `csv` and `timeParse` to transform daily country-level death counts into aggregated totals. The marker line is drawn as an SVG `<line>` element, while the path is unstyled except for a black stroke defined in the page’s CSS.

WWolfgang
92% match