Skip to main content
100%

Full of Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
Jjmetzg11alpine
Last edited Apr 22, 2023
Created on Apr 21, 2023

This example reproduces a Sol LeWitt-style geometric composition using D3.js, rendering a full-screen SVG grid of overlapping horizontal and vertical bars. Two distinct masks, created with inverted black-and-white shapes from D3’s `symbol` API, selectively reveal or hide portions of the grid, producing layered, intersecting patterns. The code uses D3’s `select`, `range`, and `join` methods to efficiently generate and update the 100 rectangles per orientation, while the `mask` elements dynamically apply the symbolic clipping paths. The final visualization is a clean, generative art piece driven entirely by SVG and D3’s declarative API.

AI-generated description

A reproduction of a Sol LeWitt art piece.

commented out section shows how to do it in vanilla javascript

MIT Licensed

Similar vizzes