Skip to main content
๐ŸŒ Public

Share visualization

Send this visualization to others.

Axes with Reactsies

Public visualization

Axes with Reactsies

0 stars1๐ŸŒ Public
JJohn Patrick Banas
Last edited Sep 11, 2021
Created on Sep 10, 2021
Forked from Margin Convention

This example shows 2019 population data for ten countries as horizontal bars with SVG axes built manually. React state manages the CSV data loaded via `d3.csv`, while `scaleBand` positions countries along the y-axis and `scaleLinear` maps population values to bar widths. The code generates tick marks and labels by iterating over `xScale.ticks()` and the y-domain, drawing grid lines and text with SVG elements.

AI-generated description

A program that loads in some data about CSS colors using D3 utilities, and uses React state to keep track of the data.

Comments

Sign in to join the discussion.

MIT Licensed