{"version":"1.0","type":"rich","title":"Smiley Face Follower - using hooks","description":"A smiling face follows the mouse cursor across an SVG canvas, updating its position in real time. The example uses React hooks, specifically `useState`, to track mouse coordinates via an `onMouseMove` event handler on the `<svg>` element, and re-renders the face accordingly. The face is composed of reusable React components—`FaceContainer`, `BackgroundCircle`, `Eyes`, and `Mouth`—where the mouth shape is generated using the `d3.arc()` function from D3 v7. All rendering is done declaratively in SVG.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/07535af2cab1465c9e5c5ec6c432c1d3?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}