{"version":"1.0","type":"rich","title":"Building Interactivity with React","description":"An interactive SVG circle follows the mouse as it moves across the screen, demonstrating how React manages state and event handling for dynamic visual updates. Built with React 17 and D3 v7, the component uses `useState` and `useCallback` to track the cursor position and update the circle's `cx` and `cy` attributes on every `mousemove`. The rendered output is a single yellow circle on a blank canvas, showcasing the integration of React's declarative JSX syntax with SVG elements inside a simple, resizable viewport.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/762a2ec8d0614cf5b2354723363d965c?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}