Display barChart: Total Worth in Billions v/s Year

100%

Display barChart: Total Worth in Billions v/s Year

✓ Published0🌍 Public

Last edited Feb 17, 2018

Created on Feb 17, 2018

This interactive bar chart, built with p5.js, displays the total worth of billionaires in billions of U.S. dollars by year. The data comes from a CSV file (billionaires.csv) containing entries from 1996, where each year’s total worth is calculated by summing the 'worth in billions' column for all billionaires in that year. The visualization uses a fixed canvas with axes labeled "Year" and "Total Worth in Billions," and maps each year to a vertical pink bar. A tooltip showing the year and total worth appears when hovering over a bar, and the bar changes color to red for feedback. The chart also includes grid lines, axis labels, and a circle that tracks the mouse position.

AI-generated description

Similar vizzes

Loading thumbnail…

Display line chart using p5: Total Worth in Billions v/s Year

This line chart displays the total worth of billionaires in billions of U.S. dollars aggregated by year, from 1996 to 2014, based on data from the billionaires.csv file. The visualization uses p5 to map year values to the x-axis and summed wealth values to the y-axis, with each data point represented by a blue circle connected by pink lines. The chart includes axis labels, grid lines, and hover interactions that display the specific year and total worth for each data point. A green circle follows the mouse cursor as a visual aid.

Aaabajaj2

94% match

Loading thumbnail…

bar chart

This bar chart displays the net worth of prominent billionaires from the 2014 dataset, with each bar representing an individual’s name and worth in billions of USD. The visualization uses D3.js v4 to create an SVG-based chart, employing `d3.scaleBand` for the x-axis categories and `d3.scaleLinear` for the y-axis values. Data is loaded from a CSV file, and axes are rendered using `d3.axisBottom` and `d3.axisLeft`, with rotated text labels for readability. The chart highlights wealth distribution across notable figures, sourced from the provided gist.

BByronHan333

81% match

Loading thumbnail…

Billionare Bar Chart

This bar chart displays the wealth of billion-dollar companies, with each bar representing a company’s worth in billions of dollars. The visualization uses p5.js to load CSV data from a GitHub Gist, sort wealth values, and render bars on a canvas with labeled axes, company names, and hover interactions that reveal approximate values. The chart shows the range of company valuations from the dataset, which was modified to include distinct companies from their earliest established time.

AAllen Ho

81% match

Loading thumbnail…

bar chart

This bar chart displays the net worth in billion USD of five billionaires from 2014, sorted by name along the x-axis with vertical bars representing their wealth. Using D3.js v4, the visualization loads data from a CSV file and renders scalable vector graphics (SVG) with `d3.scaleBand` for the categorical x-axis and `d3.scaleLinear` for the continuous y-axis. The code appends rectangles for each bar, styles them with a steelblue fill, and adds axes via `d3.axisBottom` and `d3.axisLeft`. The data originates from the provided `bar.csv` file, which includes names and corresponding worth values.

BByronHan333

79% match

Loading thumbnail…

Bar Chart in D3

This bar chart displays the net worth of the top 20 billionaires in 2014, with each billionaire’s name on the y-axis and their wealth in billions on the x-axis. The visualization uses D3 v7 to load CSV data from a GitHub gist, and renders horizontal bars as SVG rectangles scaled with `d3.scaleLinear` and `d3.scaleBand`. Text labels show exact wealth values at the end of each bar, while axis and chart titles are added using D3’s SVG text elements. The styling relies on CSS classes for bar fill and font formatting.

RRiya Mathur

79% match

Loading thumbnail…

Display Scatter plot - trivariate : Total Worth in Billions v/s Age colored by Gender

A scatter plot displays the total worth in billions against age for billionaires, with points colored by gender: blue for male, pink for female, red for no gender, and orange for married couples. Built with p5.js using data from billionaires.csv, the visualization maps age on the x-axis and total worth on the y-axis, with hovering over a point revealing its exact coordinates. The plot includes labeled axes, grid lines, and a legend showing gender categories with distinct point sizes for easier differentiation.

Aaabajaj2

78% match

Loading thumbnail…

Gist da8327383273811ba1357dbc2c3f2e7d

This bar chart displays the net worth of the top five richest billionaires in 2014, using dollar signs drawn as individual text characters to represent value. The visualization is built with p5.js, loading data from a CSV file, though the chart itself uses hardcoded values for the five billionaires and their net worth. Each billionaire is listed along the x-axis, with vertical columns of dollar signs encoding net worth in billions, and hovering over a column reveals the exact value. The chart includes labeled axes, a title, and uses a green monochrome dollar-sign texture to represent wealth.

BByronHan333

78% match

Loading thumbnail…

fresh block

This example visualizes the top five wealthiest billionaires of 2014, using a custom bar chart built with p5.js. The chart loads data from `billionaires.csv` via a preload function, though the core visualization uses hardcoded arrays of names and net worths. Each bar is drawn as a column of repeated dollar-sign characters, with values displayed interactively on mouseover. The chart includes labeled axes, a title, and uses a green monochrome palette for the bars. The code defines bar heights by stacking one `$` glyph per billion dollars, while mouse position triggers a tooltip showing the exact net worth. The visualization is a simple, hand-coded example of p5.js drawing with CSV data support.

BByronHan333

78% match