Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Different Shapes Using D3

Public visualization

Viewing a saved revision (read-only)

0c5584a21257454ba554a6eddd27bf6e

Different Shapes Using D3

0 stars1🌍 Public
Ssharmamilan632.m@gmail.com
Last edited Jun 17, 2024
Created on Jun 14, 2024
Forked from Verical Variant

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 description

A demonstration of SVG shapes.