Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Making a Bar Chart

Public visualization

Viewing a saved revision (read-only)

c33829e83cf048019110bf5c741cae7f

Making a Bar Chart

0 stars1🌍 Public
Jjayjoepark
Last edited Mar 29, 2019
Created on Mar 27, 2019
Forked from Making a Bar Chart

This bar chart displays the happiness scores of nine world regions, with bars colored on a red gradient by value. A central green circle toggles an animation that shrinks or grows the bars using a custom `transitionWidth` function, which relies on D3’s `transition` and `attr` methods. The chart is rendered as SVG with `d3.scaleLinear` and `d3.scaleBand` axes, and hovering over a bar populates a separate HTML overlay with the region’s name and score. Data comes from the CSV file using `d3.csv`.

AI-generated description

This bar chart shows population of the thirteen most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017.

Note: That link doesn't give data for the year 2018 but for the year 2015. In this example, I've used the data provided in the class (which is close to the downloaded data).