{"version":"1.0","type":"rich","title":"Dispatching Events Example","description":"A circle rendered as an SVG element changes its radius in response to clicks, demonstrating how chart instances can emit and handle custom events. Clicking the circle triggers a click handler in the Circle component, which dispatches an `input` event with a random value and a `detail` property. The main script listens for this event using D3’s `select().on()`, reads the radius from `event.target.value`, and calls the `update()` method to animate the radius via a D3 transition. The example uses `d3.create`, `d3.select`, and `transition.attr`, based on the Observable chart pattern.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/96637eb6243a41a39dc728357617817d?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}