Fork of Sol LeWitt Reproduction

100%

Fork of Sol LeWitt Reproduction

✓ Published0🌍 Public

Last edited Mar 14, 2022

Created on Jan 21, 2022

This example reproduces a Sol LeWitt-style geometric composition using overlapping horizontal and vertical bands. It generates 100 rectangles in each direction, with alternating masks that reveal or hide symbol-shaped cutouts across the canvas. The visualization uses D3 v6 to create SVG elements and mask patterns, employing `d3.range` for data generation and `d3.symbol` for the path shapes. Each mask applies a contrasting fill to selectively display the symbols, creating a layered optical effect. The rendering is fully SVG-based and responds to the window size.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition using overlapping horizontal and vertical striped rectangles, with two SVG masks revealing different symbol shapes at their intersection. The visualization generates 100 thin rectangular bands along each axis, then applies mask-1 and mask-2 to selectively display or hide regions based on d3 symbols. Built with D3 v6, the code uses `d3.select`, `d3.range`, `d3.symbols`, and `d3.symbol` to create the masked effects, rendering entirely in SVG within a full-viewport canvas.

GGbemiga Atolagbe

93% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition using D3.js, generating an intricate grid of overlapping horizontal and vertical bars. The visualization uses two mask layers to create alternating colored regions, with the second mask inverted to produce a dynamic contrast pattern. Rendered as SVG, the code employs D3's `scaleBand`, `range`, `symbol`, and `symbols` APIs to position and shape the elements, while `join` manages the data-driven rect and path creation. Layout adapts to the browser window size, with 120 bands across the full viewport.

Mmaximus2581

91% match

Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using two overlapping sets of thin horizontal and vertical rectangles. The drawing applies two distinct SVG masks to each set, creating a crosshatched grid that visually inverts where the shapes intersect. Built with D3 v6, it generates 100 rectangles per axis using `range` and `selectAll().join()`, while the `symbol` API draws a diamond-shaped mask path. The final SVG adapts to the full browser window size, with masks rendered through appended `<mask>` elements.

DDuckGorilla

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition by layering horizontal and vertical stripes with D3 SVG masks. It generates 120 evenly spaced bands across the viewport, then applies two complementary masks that alternate between black and white columns containing D3’s built-in symbol shapes (circles, crosses, diamonds, and more). The masks flip the symbol fill and stripe polarity inversely, creating an overlapping optical pattern. The code uses `d3.range`, `d3.scaleBand`, `d3.symbol`, and `d3.symbols` to structure the stripes and mask geometry.

AAprilF

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3 to generate geometric patterns of horizontal and vertical bands. It employs `d3.select`, `d3.range`, `d3.scaleBand`, and `d3.symbol` to create SVG rectangles and symbols within two masks, alternating their fills to produce an interlocking striped composition. The code uses an SVG renderer with `window.innerWidth` and `window.innerHeight` for full-screen display. While mask creation functions are defined for both layers, only the initial band structures are rendered in the current setup.

Aaalyousfi

91% match

Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece by layering vertical and horizontal striped rectangles, masked by geometric symbols to create intersecting patterns across the full screen. It uses D3 selections and joins to render 100 rect elements in each orientation, with alternating masks that reveal or hide the stripes through symbol shapes. The SVG output is generated dynamically based on window dimensions, and the masks combine D3's `symbol` and `range` APIs to position five distinct marker types. The code imports only `select`, `range`, `symbols`, and `symbol` from D3 v7.3.0.

SSamuele Greco

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example recreates a Sol LeWitt-inspired drawing using overlapping horizontal and vertical bands masked by circular cutouts. It shows how geometric compositions can emerge from simple repetitive elements. The code uses vanilla JavaScript and SVG, creating masks via `createElementNS` and appending 100 rectangles in each direction to the DOM. A D3 selection imports `select` from the d3 library, though the SVG construction is entirely manual, rendering at full window dimensions.

EErik L

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition, generating a grid of overlaid horizontal and vertical stripes that are masked to reveal a central circle. The visualization uses D3 v6 to create an SVG scene, drawing 100 rectangles in each orientation and applying two masks with contrasting black-and-white circular cutouts to shape the final pattern. The rendering fills the entire browser window, with the circle positioned at the center of the viewport.

DDuckGorilla

91% match