{"version":"1.0","type":"rich","title":"Update Pattern and Data Flow","description":"This example demonstrates the general update pattern in D3.js, where data joins control the enter, update, and exit phases of SVG circles. It shows how fruit shapes change over time: apples are eaten, replaced by lemons, or removed entirely. The code uses `selection.data`, `selection.enter`, `selection.merge`, and `selection.exit` with transitions for smooth animations. A `scaleOrdinal` maps fruit types to colors and radii, while random IDs serve as the key function. The visualization cycles through pre-scripted state changes every second, illustrating unidirectional data flow from a mutable array to rendered marks.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/f1168880cf834c06835772b92f498c4b?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}