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)

9b94438dc67a46bea5aecaee3d04df2a

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

0 stars0🌍 Public
Kkarnisrikanth2212
Last edited Mar 12, 2023
Created on Mar 12, 2023

This example shows the basic cost of Netflix subscriptions across 15 countries using a horizontal bar chart. The visualization renders SVG marks and channels through a React component that combines `useState`, `useEffect`, and `useCallback` hooks with D3’s `csv`, `scaleBand`, and `scaleLinear`. Data is loaded from a remote CSV file, with axis ticks drawn manually via `xScale.ticks()`. React controls the component lifecycle, while D3 manages scales and layout calculations for the rectangular bars.

AI-generated description

A bare minimum HTML page.