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)

66143387675f42ec85b31dcf33f6beb6

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

0 stars1🌍 Public
KKolliTeja
Last edited Mar 6, 2022
Created on Mar 5, 2022

This example shows a horizontal bar chart of the top 10 most populous countries, using React for component rendering and D3 for data loading and scales. The code loads CSV data via `d3.csv`, maps it with a custom row function, and visualizes it as SVG rectangles whose widths are scaled by population using `scaleLinear`, while `scaleBand` positions the bars. Tick marks and labels are generated manually from the scales, and the chart is rendered into a React component using `ReactDOM.render`.

AI-generated description

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

See also React Starter.