Box Plot

100%

✓ Published0🌍 Public

Last edited Feb 15, 2024

Created on Feb 13, 2024

This example shows a box plot of used video game prices from 2004–2010, with a summary of the median, quartiles, and outliers displayed across a price axis. The visualization highlights the distribution’s center and spread, using a purple rectangle for the interquartile range and small squares to mark extreme values. Built with p5.js, the sketch loads CSV data via `loadTable`, computes quartiles and the IQR manually, and renders the chart with `rect` and `text` calls on an 800×600 canvas.

AI-generated description

Box Plot of Metric Sales from Video Game Publishers form 2003-2009. Note: The data was modified to simplify the coding process Dataset from :https://corgis-edu.github.io/corgis/csv/video_games/

MIT Licensed

Similar vizzes

Loading thumbnail…

A4 Box Plot

A box plot displays the distribution of used video game prices from 2003–2010, based on data sourced from CORGIS. It visualizes key statistics including the median, interquartile range, and outlier boundaries derived using D3’s `d3.quantile` and `d3.median` functions. The chart uses D3 v7 to create an SVG rendering with a linear scale (`d3.scaleLinear`) for the x-axis, and draws rectangles and lines to represent the quartiles and range.

AAllen Jake Polintan

87% match

Loading thumbnail…

A4 Box Plot (D3)

This visualization shows the distribution of average video game play lengths from 2004 to 2008 using a single horizontal box plot, with outliers removed via the interquartile range method. The chart displays the min, max, median, Q1, and Q3 values, and hovering over any of these elements reveals the exact numeric value via SVG `<title>` tooltips. Built with D3 v7, the code loads CSV data from a GitHub gist, uses `d3.quantile` to compute quartiles, and renders the plot using SVG shapes, scales, and axes.

NNoah C.

80% match

Loading thumbnail…

BoxPlot

This box plot visualizes the distribution of Metric Review Scores for 50 video games, each selected to represent a single genre. It displays the median, quartiles, minimum, and maximum values, with outlier scores plotted as individual circles. The visualization uses the p5.js library with `createCanvas`, `loadTable`, and custom hover interactions to display box plot statistics. Data is loaded from a remote CSV file containing video game review metrics, and the scores are sorted and processed to calculate statistical values.

AAllen Ho

79% match

Loading thumbnail…

BoxPlot D3

A box plot visualizes the distribution of metric review scores across 50 video games, loaded as CSV data. The chart displays the minimum, first quartile, median, third quartile, and maximum values as interactive black lines that highlight on hover, alongside a steelblue box that changes color when moused over. Built with D3 v6, the code uses `d3.csv`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.quantile` to compute the summary statistics and render the plot as SVG elements.

AAllen Ho

77% match

Loading thumbnail…

Video Game Platforms Box and Whisker

This visualization displays box-and-whisker plots of annual video game platform sales, with each platform as a separate facet and years on the x-axis. The boxes show quartiles, whiskers extend to the IQR bounds, and outliers appear as dots, with the median marked by a thicker line. Using the Observable Plot library and D3’s `d3.csv` and `d3.rollup`, the code aggregates Global_Sales from the vgsales.csv dataset, repeating data entries to compute quartiles via `d3.quantile`. The custom `boxX` function from BoxPlot.js builds the marks, and the plot is rendered into the document body at full window size.

DDaniel Ribaudo

75% match

Loading thumbnail…

Boxplot test

This example displays a boxplot visualization of wine prices, with the chart area laid out on a pastel turquoise canvas. The code loads wine price data from a Google Sheets CSV via `loadTable` and computes the median, quartiles, and min/max values using JavaScript array operations. The drawing is implemented with p5.js, using `createCanvas` and `background` to set up the scene, though the actual boxplot rendering is not yet included in the draw loop.

SSean Sanchez

75% match

Loading thumbnail…

Box Plot

This example visualizes the distribution of salary data as a box plot, highlighting the minimum, first quartile, median, third quartile, and maximum values using a green box with a red median line. The data is loaded from a CSV file using p5.js’s `loadTable`, then processed and sorted in `setup` before a custom `drawBoxPlot` function renders the chart on a dimmed background. The code computes quantiles via a `quantile` helper function and uses p5.js drawing commands like `rect` and `line` to construct the plot directly on the canvas.

RRiya Mathur

74% match

Loading thumbnail…

boxplot

This example visualizes the distribution of automobile prices using a box plot, displaying the minimum, maximum, quartiles, median, and outliers. The code loads data from a CSV file hosted on GitHub, calculates the statistical measures with d3.min, d3.max, d3.quantile, and d3.median, and renders the chart as an SVG. It uses the d3-boxplot library to draw the box plot, with the chart titled "Box Plot of Car Prices" within a 600x400 viewport.

Iindushashi.g@gmail.com

74% match