{"version":"1.0","type":"rich","title":"Smile 😀:Exploring the SVG Canvas (Now with React.js!)","description":"This example shows a stylized smiley face composed of SVG primitives—a pink circle, two colored ellipses for eyes, and a red quadratic curve for the mouth—rendered on a 960×500 canvas. The code uses React.js to define the SVG elements as JSX, with ReactDOM rendering the component into the root div. Hardcoded coordinates and stroke widths create the face, demonstrating how React updates SVG attributes declaratively while leveraging the vector-based, lossless scaling properties of SVG.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/2b01a044d0d341e38d6dbe13d6bd016d?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}