Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Stylized Refactor REAxes

Public visualization

Viewing a saved revision (read-only)

ff9da462e60f4e598b4232a5793df3e2

Stylized Refactor REAxes

0 stars1🌍 Public
NNoelle Huchette
Last edited Jan 14, 2023
Created on Jan 14, 2023
Forked from Refactor REAxes

This example shows a horizontal bar chart of population data for the top 10 countries in 2020, using React state management with hooks to load and render the data. The visualization displays country names on the y-axis and population values on the x-axis, with formatted tick labels converting large numbers to abbreviations like “1.5B.” The code leverages D3 v5 APIs including `scaleBand`, `scaleLinear`, `csv`, and `format`, while rendering SVG elements through React components. Styling uses a custom Poppins font and muted colors, with data sourced from a CSV of the UN Population 2019 dataset.

AI-generated description

Renders data with D3, uses react state to keep track of data