{"version":"1.0","type":"rich","title":"Shapes with Svgs","description":"This example demonstrates how to draw basic geometric shapes—circles, rectangles, lines, and an open path—directly within an SVG canvas. The rendering approach uses raw SVG markup with React, where the `index.js` file sets up a minimal React component that outputs a greeting message, though the primary visualization is hardcoded in `index.html`. Styling is applied via an external CSS file, which defines classes for the line group and its path element, setting stroke colors, widths, and line-join properties. The shapes are organized in a group with a light blue fill and black stroke, positioned through SVG transforms.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/d6d6fa47ea0b4224b0ca7fd3ead7a9d6?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}