Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Bowl of Fruit - Hover to Select

Public visualization

Viewing a saved revision (read-only)

2f70d96bc5c34ee3ab154bfdf6a57331

Bowl of Fruit - Hover to Select

0 stars0🌍 Public
TTomoyukiEguchi
Last edited Jan 6, 2021
Created on Jan 6, 2021

This example shows a row of fruit shapes—apples and lemons—rendered as SVG circles, where hovering over a fruit highlights it with a black outline. The bowl updates over time as fruits are removed or replaced, with animated transitions handling enter, update, and exit states. Built with D3 v5, it uses the data join pattern, `selection.enter`, `selection.merge`, and `selection.exit` with `transition.attr` to animate circle radii and positions. Color and radius are mapped using `scaleOrdinal`, and fruit IDs are stored as random numbers.

AI-generated description