{"version":"1.0","type":"rich","title":"hover to select","description":"Hovering over a fruit circle highlights it in light blue while showing its selection state. The example demonstrates a unidirectional data flow pattern, where mouse events trigger a state change that re-renders the SVG. Using d3.v5's data join, circles transition their radius and position over one second with `transition().duration(1000)`. The `fruitBowl` module applies ordinal color and radius scales to map apple and lemon types to distinct visual properties, while `setSelectedFruit` updates the selected state on mouseover and mouseout.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"","width":960,"height":500,"cache_age":3600}