Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 selection exploration

Public visualization

Viewing a saved revision (read-only)

d42d5b1f349e4b18ada563a6da164e3f

D3 selection exploration

0 stars2🌍 Public
BBart van Pelt
Last edited Jan 4, 2023
Created on Jan 3, 2023
Forked from Hello VizHub

This example demonstrates how D3 selections manage dynamic data updates through animated circles. It uses `d3.select`, `d3.range`, and the selection’s `.data()`, `.join()`, and `.attr()` methods to bind changing arrays of position and radius values to SVG circle elements. A `setInterval` loop updates the data at 60fps, with positions and sizes driven by sine functions, causing circles to appear, disappear, and shift smoothly. The code highlights both loose coupling of data to visual attributes and the modern `.join()` API for enter/update/exit handling.

AI-generated description