Skip to main content
SimilarExport ZIP
100%

D3 Sol LeWitt reproduction

✓ Published0🌍 Public
HHtet Yan Oo
Last edited Feb 7, 2024
Created on Feb 7, 2024

This example reproduces a Sol LeWitt-style geometric composition using D3 v7 and SVG. It layers two masks over intersecting grids: one mask reveals vertical stripes through alternating D3 symbols, while the other horizontally bands the canvas with a second symbol set. The code uses `d3.range`, `d3.symbols`, and `d3.symbol` to generate the mask shapes, then applies the masks via SVG `mask` attributes. The result combines generative patterns with minimalist grid structures, demonstrating mask-based compositing in a browser window.

AI-generated description

Example of a picture create for le author Sol LeWitt

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol LeWitt Reproduction with D3

A generative reproduction of Sol LeWitt’s geometric wall drawings, this example uses D3 to compose a dense grid of horizontal and vertical stripes. Two SVG masks, each populated with a row of distinct symbol shapes, selectively hide or reveal the underlying line work to create layered, patterned intersections. The code leverages `d3.range`, `d3.symbols`, and `d3.symbol` to generate the mask paths, with `selection.call` applying the mask logic to the main SVG. The result is an algorithmic reinterpretation of LeWitt’s systematic, rule-based art, rendered entirely as vector graphics.

Xxyzcorrupt@gmail.com
91% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition using D3 v3 with SVG rendering. It shows a grid of horizontal and vertical rectangles overlaid with two circular masks, one inverted, creating a dynamic interplay of lines and negative space. The code uses `d3.range`, `d3.select`, and `d3.symbol` with `symbols[1]` to generate the mask paths. Horizontal and vertical bars are drawn at regular intervals, then clipped by the masks to produce the final pattern against a full-window canvas.

Ttriciascully
91% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces Sol LeWitt’s geometric wall drawings using D3 v3 and SVG, rendering a grid of horizontal and vertical stripes overlaid with two masks. The masks, created with SVG `<mask>` elements, cut out shapes from the stripes using D3 symbols such as circles, diamonds, and triangles. One mask inverts its fill to alternate visible and hidden symbol areas. The code leverages `d3.select`, `d3.range`, `d3.symbol`, and `d3.symbols` to generate the pattern dynamically at full window size.

SSami Friedrich
91% match
Loading thumbnail…

Sol LeWitt Reprod D3 symbols AG

This example recreates a Sol LeWitt-inspired geometric composition using D3.js. It shows a grid of thin horizontal and vertical rectangles layered to create a woven texture, with two central plus-shaped masks cutting away portions of the pattern. The code uses `d3.select`, `d3.range`, and `d3.symbol` to generate SVG elements, applying `mask` attributes to hide or reveal the intersecting lines. Two mask layers, one inverted, define the contrasting positive and negative spaces at the center of the piece.

Gguththered
90% match
Loading thumbnail…

Full Sol LeWitt Reproduction in D3

This example recreates a Sol LeWitt-style geometric composition using overlapping horizontal and vertical grid lines rendered as SVG rectangles. The lines are selectively revealed or hidden through two complementary mask patterns, each containing a row of varied symbols that create organic interruptions in the strict grid. The visualization demonstrates D3’s data-joining capabilities and masking utilities, using `d3.select`, `d3.range`, and `d3.symbols` to generate the visual rhythm. A custom `renderMask` function builds the masks, with one mask using inverted fill logic to produce contrast across the full viewport.

Mmaciekawsq@gmail.com
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3 Exercise

This visualization reproduces a Sol LeWITT-style geometric composition using overlapping horizontal and vertical line grids. Four mask layers alternate line orientations and symbol shapes—including circles, diamonds, crosses, and triangles—to create a rhythmic interplay of foreground and background elements. The code uses D3 selections, `range`, `symbol`, and `symbols` APIs to generate SVG rectangles and paths, with masks defined via `renderMask` to invert or combine patterns across the full viewport.

Kkathrynrbernard
90% match
Loading thumbnail…

Full of Sol LeWitt Reproduction with D3

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.

Jjmetzg11alpine
90% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired generative drawing using D3 v7. It displays a grid of alternating horizontal and vertical striped rectangles, with two circular mask overlays that invert the pattern in one region to create a layered visual effect. The code uses `d3.range`, `d3.select`, and `symbol` to build the SVG shapes, applying masks via `<mask>` elements. The artwork is rendered entirely with SVG attributes, using a fixed 100-step loop for each stripe direction and a dynamic viewport-sized canvas.

Wwspwll@gmail.com
90% match