{"version":"1.0","type":"rich","title":"D3 data join","description":"This example demonstrates D3’s data join pattern by animating a bowl of fruit rendered as SVG circles. It shows how entering, updating, and exiting elements are handled when the underlying data array changes over time. The code uses `selection.data`, `enter`, `merge`, and `exit` with `transition` to smoothly resize and reposition circles, while a scale maps fruit types to colors and radii. The dataset is generated in JavaScript with random IDs, and three timed updates modify the array to trigger the join animations.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/7e6d8d3b92574718a8641b2f17d3e6d2?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}