Skip to main content
100%

MB zoom circles in and out

✓ Published0🌍 Public
IIgathi
Last edited Aug 14, 2019
Created on Aug 3, 2019

Three circles, colored green, purple, and red, sit on a white canvas as the core subjects of this zooming example. The visualization demonstrates click-to-zoom interactions using d3.zoom, where clicking a circle triggers a smooth transition that scales and translates the view to center on that circle. The code uses d3.v4 with SVG rendering, and the zoom behavior is applied to the entire SVG container while individual circles respond to click events. A background rectangle handles resetting the view when clicked, and the active circle is tracked to toggle between zoomed and reset states. The data consists of a simple JSON array of circle positions, radii, and colors, rendered as SVG circle elements.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes