{"version":"1.0","type":"rich","title":"SVG Fundamentals","description":"This example demonstrates fundamental SVG shapes, including circles, rectangles, lines, and paths, rendered directly on an SVG canvas. It also shows a hover-triggered CSS transition that gradually changes a rectangle’s fill color to green, alongside a nested SVG with multiple ellipses and an animated circle that moves vertically using the SVG `<animate>` element. The code uses plain SVG markup with inline styling and attributes, such as `fill`, `stroke`, `stroke-width`, and `values` for animation, without relying on external libraries. The composition serves as a raw tutorial of core SVG capabilities.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/bccc6de5a3ad472a8d5553801c0eebde?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}