Skip to main content
SimilarExport ZIP
100%

VI Plot

✓ Published0🌍 Public
Ssherman-wq
Last edited Jul 7, 2021
Created on Jul 6, 2021

This line chart displays the smoothed number of new COVID-19 cases in Russia from January to August 2020, with individual data points highlighted as circles and a red line connecting them. The visualization uses D3 v5 with `scaleTime` and `scaleLinear` for axes, `line` for the path, and `d3-tip` to show tooltips with case counts and full dates on hover. Data comes from a CSV file with dates and smoothed case values, rendered as an SVG.

AI-generated description

This scatter plot shows one week of temperature (in degrees Celcius) in San Francisco. The data comes from Data Canvas - Sense Your City.

MIT Licensed

Similar vizzes

Loading thumbnail…

stylized line chart

This stylized line chart visualizes COVID-19 total cases in Virginia over time, using a smooth natural curve to connect data points from a CSV dataset. The visualization is built with React and rendered as SVG, leveraging D3’s `scaleTime`, `scaleLinear`, `line`, and `curveNatural` APIs to map dates and case counts. Axis ticks and labels are generated via custom components, while a teal color scheme and rounded strokes give the chart a polished, modern aesthetic.

Rrsulli4
77% match
Loading thumbnail…

COVID-19

This interactive D3.js visualization displays COVID-19 metrics over time for selected countries, allowing viewers to toggle between confirmed cases, deaths, and recoveries via two dropdown menus. The line chart uses a time-based x-axis and a linear y-axis, with a single red, blue, or green line rendered per selection. Data is loaded from a CSV file, processed by nesting and grouping entries by date, and filtered by country. The visualization uses D3's `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` for smooth curves.

WW9183907
76% match
Loading thumbnail…

Making a bar chart!

This chart displays the confirmed COVID-19 cases for the US and Russia using horizontal bars. The population values are read from a CSV file and rendered as an SVG. The code uses D3’s `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` functions within the d3.v5 framework to map the data to bar lengths and position the axes with margins. The bars are styled with a steelblue fill.

MMichael Todd
76% match
Loading thumbnail…

customized line chart

A customized line chart visualizes the daily total COVID-19 cases in Virginia during 2020, with a smooth natural curve connecting the data points. The React application uses d3.v5's `scaleTime`, `scaleLinear`, `line`, and `curveNatural` to render the SVG path, with custom axis components for the bottom and left ticks. Data is loaded from a CSV file via `csv()` and mapped to dates and case counts. The chart displays the trend of cumulative cases over the year, with a five-pixel-wide teal stroke for the line.

Rrsulli4
75% match
Loading thumbnail…

COVID-19

This D3.js visualization shows the progression of COVID-19 cases, deaths, and recoveries over time for a selected country. Users choose a status metric and country via dropdown menus, and the chart displays a smooth line chart of that metric against observation dates. The code uses D3 v5 methods like `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` to render the SVG. Data is loaded from a CSV file and aggregated by country and day using `nest` and a custom `groupByDay` function.

WW9183907
74% match
Loading thumbnail…

2nd visual

This bar chart shows the total COVID-19 cases reported in 2020 for five selected countries: the United States, India, Brazil, Russia, and the United Kingdom. It aggregates data from a CSV file hosted on GitHub, filtering records by year and location, then summing the `total_cases` field per country using `d3.nest()`. The visualization uses `d3.scaleBand` and `d3.scaleLinear` to position bars, with axes rendered via `d3.axisBottom` and `d3.axisLeft`. Interactive tooltips appear on mouseover, displaying the country name and its case count, while the SVG is animated only through these transition-based hover effects.

Jjaideeptripurani12@gmail.com
74% match
Loading thumbnail…

COVID-19 Total Cases Over Time

This visualization displays the progression of COVID-19 total cases over time as a line chart with hover-based tooltips showing exact date and case counts. It loads data from a remote CSV via d3.csv and renders an SVG line using d3.line with linear and time scales. The chart includes axes from d3.axisBottom and d3.axisLeft, and interactive mouseover/mousemove handlers using d3.pointer and d3.bisector for nearest-point detection. The tooltip, styled as a separate HTML element, updates its position and text dynamically.

AAbdul Kareem
74% match
Loading thumbnail…

Line Chart of New Covid cases in country of 3 pandemic years (interactive)

This interactive line chart displays new COVID-19 cases across ten countries over a three-year period. The visualization uses progressively fading non-hovered lines and relies on hovering over a country name in the legend to highlight its individual trend. Built with React and D3 v5, the chart employs D3’s `scaleTime` and `scaleLinear` for axes and `line` with `curveNatural` for rendering each country’s SVG path. The underlying data is sourced from a CSV file provided in the repository.

SSushmaNamidi@my.unt.edu
74% match