Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of spotify pictogram

Public visualization

Fork of spotify pictogram

0 stars0🌍 Public
CChristoph Kinkeldey
Last edited Dec 5, 2025
Created on Dec 5, 2025
Forked from spotify pictogram

This example shows five circles positioned across the screen, where clicking a circle turns it white with a black outline to indicate selection. The visualization uses React to manage selection state and a ResizeObserver hook for responsive dimensions, while D3’s `scaleLinear` maps fixed data coordinates to the container size. Circles are rendered as SVG elements via a data join, with click handlers triggering state updates that re-render the selected circle’s fill and stroke styles.

AI-generated description

D3 Circle Visualization

Interactive D3 visualization with clickable circles built with React.

Setup

Comments

Sign in to join the discussion.

MIT Licensed