Skip to main content
SimilarExport ZIP
100%

p5.js.billionaires.dotPlot

✓ Published1🌍 Public
EEunice Tu
Last edited Feb 3, 2024
Created on Jan 31, 2024
Forked from HTML Starter

This dot plot visualizes the relationship between billionaire inheritance type and total wealth, with each circle representing an individual. Data is loaded from a remote CSV file using p5.js `loadTable` in `preload()`. The sketch draws axes, gridlines, labels, and data points via the p5.js `circle()` function, mapping wealth values to x-coordinates and inheritance categories to y-positions. The visualization uses a dark background and blue circles to distinguish data points.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

dotplot_billionaires.p5.js

A dot plot shows the average net worth in billions for billionaires grouped by inheritance type, ranging from spouse or widow at $4.53 billion to fifth-generation at $2.64 billion. Built with p5.js, the sketch loads a remote CSV via `loadTable` in `preload`, then draws axes, gridlines, labels, and blue circles positioned by scaling each value along the x-axis in `draw`. The data comes from the Corgis billionaires dataset, filtered to two columns and averaged per category.

EEunice Tu
89% match
Loading thumbnail…

dotplot.billionaires.p5.js

This dot plot compares the average net worth of billionaires across different inheritance categories, from non-inherited wealth to those inherited through a spouse or widow. The p5.js sketch loads a filtered CSV dataset from the Corgis billionaires collection via `loadTable`, then renders labeled axes with tick marks and grid lines. It places each category label along the x-axis while computing the plotted positions from the average worth values in billions, though the visual encoding relies on the canvas drawing API rather than a dedicated charting library.

EEunice Tu
88% match
Loading thumbnail…

p5.js.billionaires.barplot

This bar plot visualizes the average wealth of billionaires grouped by inheritance type, using a dataset derived from the CORGIS Billionaires project. The p5.js sketch loads a CSV file via `loadTable` in `preload` and renders static bars with `rect`, axes with `line`, and text labels with `text`. The y-axis tick marks and labels are manually drawn, while each bar’s height scales proportionally to the average worth value. The chart shows that spouse/widow inheritors hold the highest average worth, while fifth-generation inheritors hold the lowest.

EEunice Tu
88% match
Loading thumbnail…

dot

This dot-and-bar visualization displays the relationship between inherited type and total net worth for billionaires, plotting categorical data along the x-axis and numerical worth values scaled vertically. The sketch loads a CSV dataset from a GitHub gist using the `loadTable` function in Processing (via p5.js), then draws axes, gridlines, and text labels on an 800×800 canvas. Bars represent worth values, with labels for inherited types positioned below, while the y-axis includes tick marks and numeric increments.

EEunice Tu
86% match
Loading thumbnail…

dotplot

A dot plot compares average wealth across inherited types of billionaires, using the Corgis Education billionaire dataset with two columns: inherited type and average worth. The sketch renders gray and black horizontal grid lines, axes, tick labels, and vertical bars encoded with negative height scaling based on worth values. Built with p5.js, it loads data via `loadTable`, draws shapes with `rect` and `line`, and positions rotated text using `push`, `translate`, and `rotate`. A legend and title clarify categories from not inherited to spouse/widow.

EEunice Tu
84% match
Loading thumbnail…

Dot Plot

This dot plot visualizes the ages of billionaires, with each green dot representing one individual’s age along the y-axis and their sequential index on the x-axis. The p5.js sketch loads a CSV dataset in `preload()` using `loadTable`, filters out zero-age entries, then renders axes, tick marks, and axis labels in `draw()`. It uses `map()` to scale data points, `ellipse()` for the dots, and `line()` for the chart framework, all within a 900x600 canvas.

RRiya Mathur
83% match
Loading thumbnail…

tri_scatter

This scatterplot uses p5.js to visualize billionaire data from the billionaires.csv dataset, plotting individual billionaires based on their net worth, age, and gender. Each point represents a billionaire, with the x-axis mapping net worth (in billions), the y-axis mapping age, and gender encoded through color or point style. The visualization reveals clusters and outliers, such as the concentration of billionaires in certain age ranges and wealth brackets, and highlights demographic trends across the dataset. The interactive canvas allows viewers to hover over points to inspect specific individuals, making it a tool for exploring wealth distribution patterns.

BByronHan333
80% match
Loading thumbnail…

Box Plot

This visualization displays a heatmap of billionaires’ wealth across global regions and years, with darker cells indicating higher net worth. Built with p5.js, it uses `loadTable()` to fetch CSV data from a GitHub gist, then renders colored rectangles via Canvas `rect()` calls. A gradient legend maps wealth values to grayscale intensities, while region and year labels orient the grid. The visualization also includes a title and custom color-mapped legend, offering a quick comparative view of wealth distribution over time.

RRiya Mathur
79% match