{"version":"1.0","type":"rich","title":"Lesson 4: Unidirectional Data Flow","description":"This example demonstrates a unidirectional data flow pattern in React, where a fruit bowl visualization updates in response to state changes. A row of apples and lemons animates as fruits are added, removed, or transformed, with mouse hover actions triggering visual outlines. The code uses D3 v5 for SVG rendering, including transitions, scales, and selection joins, within a React framework. Data is generated programmatically, not from the provided CSV, and animations occur on timed intervals.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/daea5b4539a041279148e2f01479a76f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}