Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

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

Public visualization

Viewing a saved revision (read-only)

f7829607ffc943ea8c7c97fea30b1d04

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

0 stars1🌍 Public
SSheshidharreddy
Last edited Mar 8, 2022
Created on Mar 8, 2022

This example displays a horizontal bar chart of COVID-19 case counts for 20 countries using React and D3 v5. The visualization maps each country to a green rectangle, with bar lengths proportional to population values fetched from a remote CSV file. It uses `d3.csv` for data loading, `scaleBand` and `scaleLinear` for positioning, and renders gridlines with axis ticks directly as SVG elements. The React component manages data state with `useState` and `useEffect`, while D3 handles scaling and tick generation.

AI-generated description

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

See also React Starter.