Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Sol LeWitt SVG

Public visualization

Viewing a saved revision (read-only)

3abeb8d00a1042908084b7045fc59215

Sol LeWitt SVG

0 stars1🌍 Public
VValentine Solonechnyi
Last edited May 27, 2021
Created on May 27, 2021
Forked from HTML Starter

This example reproduces a Sol LeWitt-style drawing using D3.js and SVG, displaying a grid of horizontal and vertical striped bars that are partially revealed through circular masks. Two mask layers alternate between clipping the horizontal and vertical rectangles, creating a layered composition where the bars intersect and disappear within the central circle. The code uses D3’s `select`, `range`, and data joins (`join('rect')`) to generate 100 rectangles in each direction, with masks defined via SVG `<mask>` elements and applied through `attr('mask', 'url(#circle-mask)')`. The visualization renders full-window, with dimensions derived from `window.innerWidth` and `window.innerHeight`.

AI-generated description

Sol LeWitt svg reproduction with D3.js