Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Bowl of Fruit - Click to Select

Public visualization

Viewing a saved revision (read-only)

9dfeb8a4bec746d5a12946dba513fca2

Bowl of Fruit - Click to Select

0 stars0🌍 Public
BBazarbayevManas
Last edited Aug 28, 2019
Created on Aug 28, 2019

This example shows a dynamic bowl of fruit where clicking a circle selects it, highlighting it with a black stroke. The visualization uses D3 v5's selection API and ordinal scales to map fruit types to colors and radii, with SVG circles entering through a zero-radius transition and exiting by shrinking. The code demonstrates animated data updates, including removing a fruit, changing an apple to a lemon, and filtering the array, all with 1000-millisecond transitions. The implementation uses `scaleOrdinal`, `selection.selectAll`, and `transition().duration()` to manage the stateful rendering.

AI-generated description