Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

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

Public visualization

Viewing a saved revision (read-only)

75e098e3543f4c4f8c590d0ae06b17fe

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

0 stars0🌍 Public
SSonuSriN
Last edited Mar 3, 2022
Created on Mar 3, 2022

This example shows COVID-19 deaths in Oceania until March 2022, with a horizontal bar chart ranking the top 10 countries by total deaths. The visualization uses React to render SVG marks, while D3 v5 provides the `csv` loader, `scaleBand` for the y-axis, `scaleLinear` for the x-axis, and manually generated gridlines and tick labels. Data is loaded from a GitHub-hosted CSV file and styled with CSS hover effects that change bar colors.

AI-generated description

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

See also React Starter.