Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of ICE-6

Public visualization

Viewing a saved revision (read-only)

4730b23bab2544058336691d4929f424

Fork of ICE-6

0 stars0🌍 Public
Ttejasrikotipalli1@gmail.com
Last edited Mar 20, 2024
Created on Mar 20, 2024

This example visualizes the top 12 most-played Spotify songs using a horizontal bar chart, where each bar’s length encodes the song’s duration in milliseconds. The visualization loads data from a CSV file via `d3.csv`, then slices it to the first twelve rows before rendering with React and D3 v5. Axes are manually constructed using `scaleBand` for the categorical song names and `scaleLinear` for the numeric duration, with grid lines and tick labels drawn as SVG elements. The chart uses `useState` and `useEffect` for data fetching, and the final output is rendered as an SVG within a React component.

AI-generated description

A whole smiley face