{"version":"1.0","type":"rich","title":"Interaction With Unidirectional Data Flow - Click","description":"Fruit circles animate between orange and lemon varieties while responding to clicks that select a fruit with a blue stroke. The visualization demonstrates unidirectional data flow: click events call `setSelectedId`, which updates `selectedId` and re-renders the entire scene via `fruitBowl`. D3 v5's data join, `transition`, and ordinal scales (`scaleOrdinal`) handle SVG circle updates, while timed `splice` and `pop` operations mutate the `fruits` array to trigger enter, update, and exit transitions over four seconds.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/97f141dd9ace4e5289da0a65750d517f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}