🌍 Public
Viewing a saved revision (read-only)
8ac3b0ed8f554d4caa4b3503d02dff25
Different Shapes Using D3
This example demonstrates how SVG masks can create visual variety from simple repeated shapes. Two sets of horizontal and vertical rectangles, each positioned across the full canvas, use complementary circular masks to reveal their pattern. The first mask shows the horizontal bars through a white circle on a black background, while the second inverts this to display vertical bars through a black circle on white. Built with D3 v3 and the `select`, `append`, and `join` APIs, the code generates 100 rectangles per direction, producing a crosshatch effect that is dynamically clipped to form circular windows.
AI-generated descriptionA demonstration of SVG shapes.