Sol Lewitt Project in D3 Attempt #2

Sol Lewitt Project in D3 Attempt #1

This D3.js example uses SVG masks to create an abstract composition inspired by Sol LeWitt’s wall drawings. Vertical and horizontal striped rectangles, generated with `d3.range` and `d3.select().join()`, are each partially revealed through circular masks defined with `mask` elements. Two distinct mask configurations alternate the visual prominence of the stripes, producing a dynamic interplay of lines and negative space across the full browser viewport. The rendering is purely algorithmic, with no external data source.

93% match

Sol Lewitt with D3 Project (from Scratch)

This example recreates Sol LeWitt’s geometric wall drawings using D3.js, rendering a dense grid of thin vertical and horizontal lines across the full browser window. Two opposing masks, each containing five distinct symbols from D3’s `symbol` API, selectively hide or expose portions of the line grid, creating overlapping, patterned regions. The visualization uses `d3.select`, `range`, and `join` to generate 120 rectangles in each orientation, with SVG masks applied via `mask.append` and `attr('mask', ...)`. The result is a digital homage that blends generative code with minimalist art.

92% match

Sol Lewitt in D3 part 2

This example recreates Sol Lewitt’s geometric wall drawings using D3.js, rendering 500 horizontal and vertical stripes that overlap through two SVG masks. The code uses `d3.select`, `range`, and `symbol` to generate distinct symbol shapes (like circles and triangles) that act as the mask patterns, revealing or hiding the grid lines. Mask elements are built with `svg.append('mask')` and filled paths, producing layered visual effects of intersecting bands in black and white. The rendering approach uses SVG directly, with dimensions set from `window.innerWidth` and `window.innerHeight`.

Aashutoshc018@gmail.com

90% match

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt wall drawing using D3.js, rendering 100 horizontal and 100 vertical stripes across the full browser window. It uses SVG masks to create alternating circular cutouts: the first mask (mask-1) reveals the grid in white with a black circle, while the second (mask-2) inverts the effect. The code employs D3’s `select`, `range`, `symbol`, and `symbols` APIs to generate the geometric composition. The final output is a generative pattern where the intersection of stripes and circular voids produces the artwork’s characteristic visual rhythm.

CCurran Kelleher

Sol Lewitt Project in D3 Attempt #1 (group method)

This D3.js (v7.9.0) example constructs an SVG composition inspired by Sol LeWitt's geometric art. It draws a grid of vertical and horizontal stripes, each set masked by overlapping circles centered on the canvas. The first group of vertical rectangles is clipped by a circular mask, while the second group of horizontal rectangles is clipped by an inverse mask, revealing a cross-like pattern. The project uses D3's `select`, `append`, `range`, and the `.join()` API to build the SVG elements programmatically.

Full Sol Lewitt Reproduction with D3

This visualization reproduces a Sol LeWitt wall drawing using D3.js to generate a grid of alternating horizontal and vertical stripes across the full screen. Two masks—one inverted—cut circular symbol shapes from the stripe patterns, creating overlapping geometric forms. The code uses d3.select, d3.range, d3.symbol, and d3.symbols to render SVG paths, with each mask applied via SVG mask elements. The result is a dynamic, screen-filling composition that highlights D3's ability to create intricate generative art from simple primitives.

PPhan Nguyen

Full Sol lewitt reproduction with D3 - exercise

This example reproduces a Sol LeWitt-style wall drawing using D3.js, rendered as an SVG of alternating horizontal and vertical grid lines. Two mask layers, each containing a different geometric symbol from D3’s symbol generator, selectively reveal or hide portions of the grid. The first mask is inverted to expose lines through one set of shapes, while the second uses a complementary fill to display the remaining pattern. The code relies on `d3.select`, `d3.range`, `d3.symbol`, and `d3.symbols` to construct the composition dynamically.

Kkakkanadjoy@yahoo.com

Sol Lewitt Project in D3 Attempt #1 (d3-shape & function block)

A generative SVG composition draws on Sol Lewitt's geometric wall drawings, using striped vertical and horizontal bands overlaid with a central symbol. The code employs D3 v3's `select`, `range`, and `join` to create rect grids, while `d3.symbol` and `symbols[6]` define a star-shaped path. Function blocks `renderMask` apply inverted and normal SVG masks, combining the shapes to produce layered, intersecting patterns across the full viewport.