Skip to main content
SimilarExport ZIP
100%

Fork of Box Plot

✓ Published0🌍 Public
XXiaoyu Su
Last edited Apr 2, 2021
Created on Apr 2, 2021
Forked from Box Plot

This fork of a box plot visualizes the distribution of new COVID-19 cases across different locations, showing the minimum, first quartile, median, third quartile, and maximum values for each group. The chart uses React to render SVG elements, with D3.js functions like `scaleBand` and `scaleLinear` for axes and `quantile` for statistical calculations. The data is filtered to include only values above 5500 new cases and loaded from a CSV file via `d3.csv`.

AI-generated description

A program to plot box plot

Plot is showing min, quantile 1, median,quantile3, max values for sepallength of Setosa, Versicolor, and Viginica Iris data is available here [https://gist.github.com/manasishrotri/ee68ea71a0867091c6dbf96b77d0c63f]

BoxPlot inspired from (d3-graph-gallary)[https://www.d3-graph-gallery.com/graph/boxplot_several_groups.html]

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Box Plot

This visualization presents a fork of a classic box plot, summarizing the distribution of new COVID-19 cases across different locations using React and D3 v5. The view displays min, quartiles, median, and max values for each categorical group after filtering to cases above 5,500. The implementation uses D3's `scaleBand`, `scaleLinear`, and `quantile` functions to compute the five-number summaries and render SVG elements, including vertical range lines, interquartile rectangles, and median markers. Data is loaded from a CSV file hosted on GitHub via D3's `csv` loader.

Vvryvarma5577@gmail.com
95% match
Loading thumbnail…

Fork of Box Plot

This visualization presents a fork of a classic box plot, summarizing the distribution of new COVID-19 cases across different locations using React and D3 v5. The view displays min, quartiles, median, and max values for each categorical group after filtering to cases above 5,500. The implementation uses D3's `scaleBand`, `scaleLinear`, and `quantile` functions to compute the five-number summaries and render SVG elements, including vertical range lines, interquartile rectangles, and median markers. Data is loaded from a CSV file hosted on GitHub via D3's `csv` loader.

Vvryvarma5577@gmail.com
95% match
Loading thumbnail…

Fork of Fork of Box Plot

This example shows box plots for new COVID-19 cases by country, displaying minimum, first quartile, median, third quartile, and maximum values derived from a CSV dataset. The chart uses the D3 `scaleBand` and `scaleLinear` functions for positioning, with React components rendering each plot element as SVG. The data is aggregated using D3’s `nest`, `quantile`, and `rollup` functions, and the visualization is inspired by a D3 graph gallery example. Axis ticks are generated separately with custom React axis components.

Vvryvarma5577@gmail.com
93% match
Loading thumbnail…

Fork of Box Plot

This example shows a box plot for daily new COVID-19 cases across countries, displaying the minimum, first quartile, median, third quartile, and maximum for each location. The chart uses React to render SVG elements, with D3 v5’s `scaleBand`, `scaleLinear`, `quantile`, and `nest` functions to compute summary statistics and position the boxes, whiskers, and median lines. Data is loaded as CSV from a GitHub gist and filtered to include only countries with case counts above 5,500.

Vvryvarma5577@gmail.com
92% match
Loading thumbnail…

Box Plot

This box plot visualizes the distribution of daily new COVID-19 cases across countries, showing minimum, quartiles, and maximum values. The chart uses React to render SVG elements with d3.scaleBand and d3.scaleLinear for axes, while d3.nest() and d3.quantile compute the statistical summaries from the CSV data. The code manually draws each box, median line, and whisker using React components, with d3.csv loading the source data.

Mmanasishrotri
88% match
Loading thumbnail…

Box Plot

This box plot visualizes the distribution of COVID-19 case counts across selected countries, showing min, first quartile, median, third quartile, and max values using a vertical whisker-and-box layout. The chart is built with React and D3 v5, using `scaleLinear` and `scaleBand` for positioning, `d3.nest` and `d3.quantile` to compute summary statistics, and SVG `rect` and `line` elements for rendering. Data comes from a CSV file of global COVID-19 figures, filtered to include only countries with at least 5,500 new cases.

CChristian Magelssen
87% match
Loading thumbnail…

Fork of country

This interactive scatterplot visualizes COVID-19 metrics across countries, plotting attributes like new cases against total cases on logarithmic-scaled axes. Each circle represents a country, colored by continent, with a legend to the right. The visualization uses React with D3 v5 scales (`scaleLinear`, `scaleOrdinal`) to render SVG marks and axes. Data is loaded asynchronously from a CSV file using D3's `csv` method, with dropdown menus allowing users to switch between different case and death metrics for the x and y axes.

Rrushithareddyy
82% match
Loading thumbnail…

Fork of Fork

This visualization uses D3.js to plot COVID-19 data from a WHO global dataset, showing total cases against total deaths for each country as individual circles. The scatter plot uses D3's `csv` loader and `scaleLinear` functions to map the data, with axes labeled "Total Cases" and "Total Deaths." Circles are rendered in steelblue, and the chart is drawn as an SVG in a React application. The code defines its own width, height, and margins, using D3's `axisBottom` and `axisLeft` to generate the axes.

66264kusuma@gmail.com
82% match