{"version":"1.0","type":"rich","title":"Loading data using React","description":"This example combines React and D3 v7 to create a smiley face whose eyes jitter randomly on each render. The face is drawn with SVG primitives, including a linear gradient for the face, and D3’s `arc` API generates the mouth path. React components compose the face, eyes, and mouth, while `useState` and `useCallback` track mouse movement to position a separate outline circle, demonstrating interactive SVG rendering in a React framework. The source data is entirely procedural, with no external data loading.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/0838a4c0f0c24a57bf4a74071567c8cc?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}