Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Bar Chart of P5 CSV Loader in CS 360

Public visualization

Bar Chart of P5 CSV Loader in CS 360

0 stars2🌍 Public
Hhxu51@usfca.edu
Last edited Feb 4, 2025
Created on Feb 4, 2025

This example displays a horizontal bar chart of fuel economy (mpg) for a list of car models, sorted by name. It loads the data from a remote CSV file using p5.js’s `loadTable()` in the `preload()` function, then parses the columns into arrays. The sketch draws axes, gridlines, and bars with `rect()` in `drawHorizontalBarChart()`, mapping economy values to bar lengths with `map()` and labeling each bar with truncated car names.

AI-generated description

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

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed