{"version":"1.0","type":"rich","title":"Clickable Circles with D3 Rosetta","description":"Six circles represent BMW models, positioned by coordinates from static data, with color, stroke, and layer order reflecting a user-selected vehicle. Built on d3-rosetta’s `unidirectionalDataFlow` pattern, the example uses `one`, `createStateField`, and `createMemoize` to manage the SVG, render circles via a D3 join, and handle click events that update state, re-rendering with `highlightSelectedDatum` to visually emphasize the chosen datum.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/0a695beafcf84dd48d928c3a4e72303d?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}