Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Bar chart with D3

Public visualization

Bar chart with D3

0 stars0🌍 Public
BBenjamin Ogorek
Last edited Mar 28, 2020
Created on Mar 16, 2020

A horizontal bar chart displays workout volume for muscle groups, with bars sized by sets per week and grid lines for readability. The chart uses D3 v5's `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to generate SVG elements from a CSV file loaded via `d3.csv`. Axis labels and a title are added via SVG text, while tick formatting uses `d3.format`. The code removes default axis lines and relies on CSS classes for styling, including steelblue bars and custom font sizes.

AI-generated description

Loading the d3 script from UNPKG puts a d3 variable in the global namespace. (Take out "browse" from that link to load it.

Axes

Here's the tool for trying out formatting.

Comments

Sign in to join the discussion.

MIT Licensed