🌍 Public
Viewing a saved revision (read-only)
9c174e10146b48188ceb38d309690ab2
Fork of ICE-6: Rendering Marks and Channels with React & D3
Kkarnisrikanth2212
Last edited Mar 12, 2023
Created on Mar 11, 2023
This example shows the total cost of living for 15 U.S. cities using a horizontal bar chart rendered as SVG. The React component loads data from a CSV file with d3.csv, then uses d3.scaleBand and d3.scaleLinear to map city names and costs to positions and bar widths. Custom tick marks are drawn manually using array mapping, with d3.format applied to axis labels. The visualization demonstrates integrating React state management with D3’s scaling and data-loading utilities for a static, styled bar chart.
AI-generated descriptionA bare minimum HTML page.