{"version":"1.0","type":"rich","title":"Clickable Circles with D3 Rosetta","description":"This example shows a scatterplot of BMW car models positioned by x and y coordinates, with clickable circles that highlight the selected model in white with a black stroke while resetting others to black. Built with D3 v7 and the d3-rosetta library’s unidirectional data flow, it uses `setupSVG` with `one` to manage the SVG, `renderCircles` with `join` for circle rendering, and `setupClickInteraction` to handle click events that update state via `createStateField`. The data comes from a static dataset of car sales records.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/4326835b77fd4c46b3953ad8fd160149?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}