🌍 Public
Viewing a saved revision (read-only)
b1ba8c2a72ae480880cf0ebb8a72879b
ICE-6: Rendering Marks and Channels with React & D3
This example shows the relationship between customer age and annual income using a horizontal bar chart of the first 15 records from a CSV dataset. Each bar’s length encodes income via a linear scale, while age categories are positioned on a band scale. The visualization is built with React components that render SVG marks, using D3 v5 utilities like `scaleLinear`, `scaleBand`, and `max` for data processing and scaling. Grid lines and axis ticks are generated from the linear scale’s tick values, with the dataset loaded asynchronously via `d3.csv`.
AI-generated descriptionA bar plot of customer age to Annual Income.
Data: Customer Data.