{"version":"1.0","type":"rich","title":"practice11--hover","description":"A D3.js smiley face made of fruit-shaped circles demonstrates hover interactions, where each circle changes its stroke color when a fruit is selected and returns to normal when the mouse leaves. The visualization shows five apples that shrink, disappear, and transform into a lemon over time, with transitions animating radius and position changes. Using d3-selection, d3-scaleOrdinal, and transition.attr, the code binds data to circles, updates attributes via .merge(), and removes exiting elements with a collapsing radius animation.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/650c864654324bb5950c2f98ce99641a?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}