Skip to main content
SimilarExport ZIP
100%

Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
CCheah Peng Huat
Last edited Jul 9, 2024
Created on Jul 9, 2024

This piece creates layered horizontal and vertical bands that pass through stencil-like openings formed by rotating geometric symbols. The composition is generated by drawing 20-pixel-wide rectangular strokes across the full canvas, masked by two inverted patterns built from D3's `symbol` generator. Using D3 v7 APIs such as `select`, `range`, `symbols`, and custom mask rendering, the artwork changes with the browser window’s dimensions, reproducing a generative Sol LeWitt aesthetic through pure SVG output.

AI-generated description

A reproduction of a [Sol Lewitt art piece]

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol LeWitt Reproduction with D3

A generative reproduction of a Sol LeWitt art piece uses D3 to draw intersecting horizontal and vertical striped bands filtered by two complementary masks. The SVG rendering employs `d3.select`, `d3.range`, `d3.symbol`, and `d3.scaleBand` to place alternating white and black symbol shapes within each mask, creating a woven visual pattern. The masks alternate transparency to combine the striped layers, producing a geometric composition that echoes LeWitt’s systematic wall drawings.

CCurran Kelleher
91% match
Loading thumbnail…

Sol LeWitt Reproduction with D3

A reproduction of a Sol LeWitt wall drawing renders an abstract geometric composition using D3 and raw SVG. The piece shows a circular region at the canvas center, filled with alternating horizontal and vertical black-and-white stripes that crisp boundary. The code builds SVG elements directly, using a circle mask with two nested masks to divide the stripe layers: horizontal rects clipped by one circle mask, and vertical rects clipped by another inverted mask. It uses no D3-specific APIs, relying on native `document.createElementNS` and `setAttribute` to generate 100 rect stripes per direction.

CCheah Peng Huat
90% match
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
90% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This interactive SVG reproduction of a Sol LeWitt piece uses D3 to generate a grid of horizontal and vertical stripes. The code defines two masks that selectively reveal or hide the stripes based on a series of symbol-shaped paths, creating a dynamic and layered geometric composition. The program uses D3's `select`, `range`, `symbol`, and `symbols` functions to build the SVG elements and masks, with the rendering adapting to the window size. The artwork's behavior is driven entirely by the mask transformations and symbol generation.

Rrwata97
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3

A generative reproduction of a Sol LeWitt wall drawing uses D3 selections, data joins, and SVG masks to compose layered striped patterns. The code generates 100 horizontal and vertical rectangles and applies two masks, each containing different D3 symbol shapes, to carve alternating geometric forms across the grid. Masks are constructed programmatically via a reusable `renderMask` function, toggling between inverted and non-inverted fills. The example relies on `d3.range`, `d3.symbols`, `d3.symbol`, and method chaining to build the full composition dynamically based on the viewport size.

Vvivhogan@gmail.com
90% match
Loading thumbnail…

Sol LeWitt reproduction with D3

This D3.js reproduction of a Sol LeWitt piece covers the viewport with two sets of striped rectangles—horizontal bands and vertical bands—that intersect at a central circular area. The rendering uses SVG masks (`circle-mask` and `rect-mask`) to selectively reveal or hide stripes, creating the illusion of a circular window through the grid. The code draws 100 rects in each orientation, layering them with opposite mask fills to alternate visibility. This generative artwork leverages D3's `select`, `range`, and `join` API to build the SVG structure dynamically, scaling to the full window size.

DDilara Bozkurt
89% 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
89% match
Loading thumbnail…

Full Sol LeWitt Piece Reproduction with D3

This example reproduces a Sol LeWitt wall drawing using D3.js to generate SVG shapes. It layers horizontal and vertical striped rectangles, each filtered by a separate mask. The masks are built from alternating black and white bands containing geometric symbols, such as arcs and lines, drawn with the `symbol` and `symbols` APIs. By inverting the mask colors, the piece creates intersecting patterns across the full browser window, with the rendering using D3’s `select`, `range`, and `join` methods for efficient SVG construction.

MMika Kutila
89% match