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)

84942cac4d514b01a50a3fa5b0f3a71a

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.