{"version":"1.0","type":"rich","title":"Intro to D3","description":"This example builds a stylized smiley face entirely with React and SVG, using a full-screen viewport and centralized coordinates. The code defines circle elements for the head, two eyes, and an implied mouth, with properties like `eyeOffsetX`, `eyeRadius`, and `strokeWidth` controlling the layout. Rendered through ReactDOM, the face resizes to the browser window, drawing a yellow circle with a black stroke and two smaller black circles for eyes. The approach demonstrates how to compose SVG shapes programmatically in a React component rather than using D3’s data-binding utilities.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/7b910984f3014e8abc5f285f65183c24?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}