{"version":"1.0","type":"rich","title":"smiley face","description":"This example renders a yellow smiley face from modular React components, combining a background circle, two eyes, and a mouth arc. The face is assembled using SVG circles and a path generated by the `d3.arc()` API, with the mouth’s shape determined by inner and outer radii and start/end angles. The `Face` component composes separate `BackgroundCircle`, `Eyes`, and `Mouth` subcomponents, all positioned via a centered `<g>` transform within an SVG container. D3 v7 provides the arc generator, while React manages the component hierarchy and props for sizing, offsets, and stroke widths.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/3d09ae157b78471584033c5da0f4ddc4?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}