Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

ICE-06: Rendering Marks and Channels with React & D3</html><title>

Public visualization

Viewing a saved revision (read-only)

504f218ef990473eaa7d6be012b2f3c3

ICE-06: Rendering Marks and Channels with React & D3</html><title>

0 stars0🌍 Public
Ssnehareddygurram
Last edited Mar 10, 2023
Created on Mar 10, 2023

This visualization displays the basic costs of 15 selected services for the 2022 quarter year, presented as horizontal bars sorted by country. Built with React and D3 v5, it loads CSV data from a GitHub gist and renders an SVG chart. The code uses `d3.csv` for data parsing, `d3.scaleBand` and `d3.scaleLinear` for axes, and D3’s `max` function to determine the x-domain. React manages the state and conditional rendering, showing a loading message until the data arrives.

AI-generated description

A bare minimum HTML page.