Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

zoomable circles with d3 zoom

Public visualization

Viewing a saved revision (read-only)

9f68e81b3b7f4c799b58829cc7a46e0d

zoomable circles with d3 zoom

0 stars0🌍 Public
Ccoreyfnolan@gmail.com
Last edited Mar 11, 2024
Created on Mar 11, 2024
Forked from Circles with D3

This example shows a set of colored circles positioned on a light green background, which can be zoomed and panned through mouse or touch gestures. The visualization uses D3's zoom behavior to apply a transform to a group element, updating the state object with each zoom event. The circles are rendered with D3 selections, each assigned fixed coordinates, radii, and fill colors from an inline data array. The code leverages the d3.zoom API and the state management pattern to persist the current transform across re-renders.

AI-generated description

Creating circles with D3.

Challenge

  • Fork this example
  • Modify it
  • Maybe make it Halloween themed
  • Maybe make it Christmas themed
  • Be creative