Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

SVG Fundamentals

Public visualization

SVG Fundamentals

0 stars0🌍 Public
Ssh_ip
Last edited Dec 3, 2024
Created on Nov 22, 2024
Forked from HTML Starter

This example reproduces a Sol LeWitt-inspired geometric composition using layered SVG elements and D3.js. It draws a grid of horizontal and vertical rectangles across the full viewport, with each line partially masked to create intricate overlapping patterns. The visualization uses D3’s `select`, `range`, `symbols`, and `symbol` APIs to generate two masks containing circular, triangular, and other symbol shapes. These masks apply inverse fill logic—one inverting the grid’s visibility—producing a dynamic interplay between the background lines and foreground symbolic cutouts. The rendering relies entirely on SVG attributes like `mask` and `fill`.

AI-generated description

A reproduction of a Sol LeWitt aart piece

Comments

Sign in to join the discussion.

MIT Licensed