data viz svg
This example demonstrates a geometric composition of three identical shapes arranged horizontally, each consisting of a yellow circle with a rectangular base and stem, colored orange, blue, and pink. A separate polyline path with connecting segments appears below the shapes in teal. The visualization uses D3 v6 to render SVG elements directly in the HTML, with CSS controlling the line styling via the `.lines` class, while all positional offsets are applied through SVG `transform` attributes on the `<g>` groups.