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)

04f286bf04794a7ea32cfd2cb004d61f

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

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

This bar chart displays the top 20 countries by reported COVID-19 cases, using horizontal bars to compare values. The visualization loads CSV data via `d3.csv` and slices the first 20 rows, with React managing state and rendering SVG elements. Scales are created using `d3.scaleBand` for the y-axis and `d3.scaleLinear` for the x-axis, with axis ticks manually generated and mapped to React components. Each bar is drawn as a `rect` element, with the x-axis grid lines and tick labels rendered as SVG `line` and `text` elements.

AI-generated description

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

See also React Starter.