D3 - LeWitt Full

100%

D3 - LeWitt Full

✓ Published1🌍 Public

Last edited Sep 29, 2022

Created on Sep 26, 2022

This example uses D3 (version 7) to generate an abstract geometric composition inspired by Sol LeWitt. Horizontal and vertical striped rectangles are layered and masked by a central diamond shape, created with the `symbol` API. Two SVG masks—one inverted—control which stripes appear inside versus outside the diamond, producing a cross-hatched visual effect. The rendering is purely computational, using `range`, `join`, and SVG elements without any external data source.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

D3 - LeWitt Full 3

This visualization uses D3.js to generate a layered composition of horizontal and vertical bands that interact through custom SVG masks. The code creates 100 alternating stripes across the canvas, with horizontal bars masked against circular symbols and vertical bars masked against their inverse, producing an intricate geometric interplay inspired by Sol LeWitt's wall drawings. Using D3's `select`, `range`, and `symbol` APIs, the example constructs two overlapping line grids whose visibility is modulated by the mask patterns, creating a dynamic Moiré-like effect. The piece is rendered entirely as SVG, with the mask system built through reusable functions that toggle between positive and negative space.

Ttomasnihlen

91% match

Loading thumbnail…

D3 - LeWitt Full 5

This example generates a generative art composition in the style of Sol LeWitt, using an SVG canvas and D3.js. Horizontal and vertical striped bars are combined with two masks containing scaled D3 symbols, creating an intersecting interplay between the bar grid and the shapes. The code uses `d3.select`, `d3.range`, `d3.symbols`, and `d3.symbol` with `d3.symbol()` to render the masked paths. The output is a purely procedural, abstract visualization driven by layout and masking logic, with no external data source.

Ttomasnihlen

91% match

Loading thumbnail…

D3 - LeWitt Full 4

An algorithmic drawing of interlocking geometric bands fills the entire viewport. It uses two perpendicular sets of thin, rectangular strips that are selectively masked by a large, rotated shape. The masks define overlapping silhouettes across the bars, creating a dynamic visual interplay reminiscent of Sol LeWitt’s wall drawings. The piece is rendered in SVG using D3’s `select`, `range`, `symbols`, and `symbol` APIs, applying `mask` elements to produce the composite result.

Ttomasnihlen

89% match

Loading thumbnail…

D3 - LeWitt Full 2

This generative art piece creates a grid-based composition of horizontal and vertical bars overlaid with a star-shaped mask. The artwork is built using D3.js, with the `select`, `range`, `symbols`, and `symbol` APIs. Two sets of rect elements are positioned and sized based on calculated indices, then masked by two separate mask definitions, each containing a star path from D3's symbol set. The rendering is an SVG output, filling the entire browser viewport and resulting in a dynamic interplay between the striped background and the cutout star shapes.

Ttomasnihlen

88% match

Loading thumbnail…

Full D3 Sol LeWitt pt2

This example reproduces a Sol LeWitt-style geometric composition using D3 v3 and SVG rendering. It shows a grid of thin vertical and horizontal rectangles spanning the full viewport, with each set masked to reveal a central diamond shape through alternating positive and negative space. The code builds the masks by appending `mask` elements with contrasting fill colors, then draws the diamond using a D3 path generator with the `symbol` API and a large size value. The layout relies on `d3.range` to generate 100 equally spaced rectangles along each axis.

AArturo Guevara

88% match

Loading thumbnail…

Full Sol LeWitt reproduction with D3

This example reproduces a Sol LeWitt wall drawing using D3 v7, rendering a grid of intersecting rectangles with SVG masks. It shows alternating striped patterns: one set of horizontal and vertical bands is masked by a black diamond symbol, while the other is masked by an inverted version. The code uses `selection.join`, `range`, and `symbol` with `symbols[1]` to generate paths, applying masks via `svg.append('mask')` and `attr('mask', ...)`. The visualization is data-free, instead deriving geometry from the browser’s window dimensions, and outputs pure vector shapes.

DDilara Bozkurt

87% match

Loading thumbnail…

Full Sol LeWitt Reproduction D3 v2

A full-screen D3 visualization reproduces Sol LeWitt’s wall drawing using 48 horizontal and 48 vertical striped rectangles. Two SVG masks, created with `d3.symbol` and the `symbols[0]` diamond path, define circular cutouts that invert the stripe pattern. The code uses D3 v7’s `select`, `range`, and `join` to generate elements, with the second mask rendered in opposite fill colors to create a contrasting central motif. Rendering is purely SVG-based without animation.

Ttverdone

87% match

Loading thumbnail…

D3-Sol-LeWitt--1

This example generates an abstract geometric composition inspired by Sol LeWitt, rendered as SVG. It creates a grid of horizontal and vertical stripes across the full window, then applies two circular masks with a star-shaped symbol from the d3 library. The masks use boolean-like inversion, alternating black and white fills to create contrast between the masked regions. The code uses d3’s `select`, `range`, `symbol`, and `symbols` APIs, and builds the visualization procedurally with no external data source.

AAbdulafeez-okewunmi

87% match