Corona Virus LineChart

100%

Corona Virus LineChart

✓ Published1🌍 Public

Last edited May 21, 2024

Created on May 16, 2024

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.

AI-generated description

Smiley face implementation with React & D3, using a React component.

MIT Licensed

Similar vizzes

Loading thumbnail…

Corona Virus LineChart with Axes

This interactive chart displays global COVID-19 deaths over time using a single black line path, with horizontal and vertical marker lines highlighting the six-million-death milestone and the most recent date. Built with React and D3 v5, it uses `scaleTime`, `scaleLinear`, and `line` from d3-shape to generate the SVG path, while `axisBottom` renders the time axis. The data comes from the CSSEGISandData COVID-19 GitHub repository and is aggregated daily. The chart dynamically updates to fill the browser window, with subtle gray gridlines and labeled annotations.

SShanmukh

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

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

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

93% match

Loading thumbnail…

Coronavirus Line Chart

This line chart displays the total global COVID-19 deaths over time, based on data from the CSSE at Johns Hopkins University. It includes a vertical marker at the most recent date and a horizontal reference line at 6.5 million deaths. The visualization is built with React and D3 v5, using `scaleTime`, `scaleLinear`, and the `line` generator to render an SVG path. The CSV data is loaded and transformed with `d3.csv` and `timeParse`.

NNikita Toropov

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

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

92% match

Loading thumbnail…

Coronavirus Basic Line Chart

This visualization shows the global total number of COVID-19 deaths over time as a single line chart. Death totals are summed daily across all countries from the CSSE COVID-19 time-series dataset. The React component uses d3.scaleTime and d3.scaleLinear for axes, and a d3.line generator to create the SVG path. Data is loaded with d3.csv and transformed with d3.timeParse, then rendered as a thick steelblue stroke on a light gray background.

NNita

92% match