Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of ICE-6: Rendering Marks and Channels with React & D3

Public visualization

Viewing a saved revision (read-only)

45a66bcdd4f24ed48b55d96c70e86689

Fork of ICE-6: Rendering Marks and Channels with React & D3

0 stars0🌍 Public
Mmandalasaikrishna007
Last edited Mar 7, 2022
Created on Mar 7, 2022

This example shows a horizontal bar chart of the top 10 novelists ranked by their book counts, using React to render SVG marks and D3 scales to map data to positions. The code loads CSV data with `d3.csv`, slices it to 10 entries, and uses `d3.scaleBand` for the categorical y-axis and `d3.scaleLinear` for the quantitative x-axis. Blue gridlines and tick labels are generated manually via `.ticks()` and `.domain()`. React state and effects (`useState`, `useEffect`) manage asynchronous data loading and re-rendering.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.