{"version":"1.0","type":"rich","title":"Smiley Face Part 1","description":"This example renders a grid of procedurally generated smiley faces using React and D3 v7. Each face is composed of SVG shapes—a yellow background circle, black eyes, and a mouth created with the d3 `arc` generator. The `Face` component composes smaller components (`BackgroundCircle`, `Eyes`, `Mouth`) inside a `FaceContainer`, while the `App` maps over an array of 18 faces, randomizing eye offset, eye radius, mouth width, and mouth radius for each. The result is a playful, varied collection of faces displayed in a fixed-size SVG canvas.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/9952a65b8bd44d5c8f33f0ee0d2e96b7?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}