Sol Lewitt Variant Full

100%

Sol Lewitt Variant Full

✓ Published1🌍 Public

Last edited Sep 12, 2025

Created on Sep 12, 2025

Forked from Sol Lewitt Variant with D3 with Groups

This example reproduces a Sol Lewitt-inspired drawing using layered horizontal and vertical striped rectangles, masked to create a central diamond-shaped cutout over a circular void. The visualization builds an SVG canvas with D3 selections, generating 100 strips in each direction and applying two distinct masks to shape the composition. The code relies on D3’s `range`, `select`, and `symbol` APIs, with masks defined via SVG elements and paths. No external data is used; the artwork emerges purely from algorithmic geometry and procedural rendering.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol Lewitt Variant with D3

This example reproduces Sol Lewitt’s geometric wall drawing as an interactive SVG visualization. It displays a grid of alternating horizontal and vertical stripes, masked into two overlapping circular windows at the center of the canvas. Using D3 selections and data joins, the code generates 100 rectangles in each direction via `range(n)`. Two SVG masks with complementary black-and-white circles control which stripes appear inside each circle, creating a layered optical effect.

Iibaird6@gatech.edu

90% match

Loading thumbnail…

Full Sol Lewit reproduction using D3

This example reproduces a Sol LeWitt-style geometric drawing using D3.js, combining SVG rectangles and mask elements to create layered visual patterns. It generates 100 horizontal and vertical striped rectangles, each masked by one of two masks that reveal D3’s built-in symbol shapes—including circles, crosses, diamonds, squares, stars, triangles, and wye—positioned across the canvas. The code uses `d3.range` and `d3.symbol` with `d3.symbols` to render the symbol paths, while `d3.select` handles SVG manipulation and the `mask` attribute applies the clipping patterns. The rendering is fully SVG-based within a full-viewport layout.

AAshwani Sajwan

89% match

Loading thumbnail…

Sol Lewitt Project

This example generates a geometric abstraction inspired by Sol LeWitt, layering horizontal and vertical striped rectangles over an SVG canvas. Two circular masks create a contrast where a central white circle reveals the full pattern, while the surrounding area inverts it. Using D3’s `select` and `range`, it appends over one hundred rect elements per axis, with widths and heights derived from window dimensions. The SVG `mask` elements, defined with white and black circles, control visibility, producing a precise, grid-based visual composition.

JJohnny Dodge

89% match

Loading thumbnail…

Sol Lewit Reproduction Vertical

This example reproduces a Sol LeWitt-style drawing with vertical and horizontal striping. Thin vertical and horizontal rectangles are drawn across the full width and height of the viewport, each masked so only a central circular region reveals the intersecting grid pattern. The visualization uses D3 selections, data joins with `range()`, and SVG `mask` elements to layer two complementary color schemes. The code relies on D3 version 7.8.5 and renders entirely as an SVG graphic.

Aayo

88% match

Loading thumbnail…

Sol lewitt vertical variant

This example renders a generative, minimalist composition inspired by Sol LeWitt. It displays a lattice of vertical and horizontal strips on a full-window SVG canvas, with the pattern revealed only inside a circular region at the center. The code builds the artwork by appending SVG `rect` elements and applies a circular mask using a dedicated SVG `mask` element. The visualization uses raw JavaScript and the DOM API to construct the SVG elements directly.

Iibaird6@gatech.edu

88% match

Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style drawing using overlapping horizontal and vertical striped rectangles, masked to reveal a white diamond shape at the center and a black circle behind it. The visualization is rendered as an SVG using D3 v7, leveraging `select`, `range`, `join`, and `symbol` APIs to generate the grid of lines. Two masks (`circle-mask` and `circle-mask2`) combine the shapes, with the horizontal bars visible through the diamond and vertical bars elsewhere. The code imports from `d3` and appends elements to the body, adapting to the full window size.

Lliu yang

88% match

Loading thumbnail…

Sol_LeWitt

This example reproduces a Sol LeWitt wall drawing using D3.js, rendering a grid of horizontal and vertical stripes on an SVG canvas. The stripes are masked by two overlapping circles, creating a circular intersection pattern that reveals and hides parts of the grid. The code uses `d3.select`, `d3.range`, and SVG `mask` elements to define the visual effect. The artwork scales to the browser window, with masks controlling which stripes remain visible, echoing LeWitt’s geometric, systematic style.

Ffcordon@pin.upv.es

88% match

Loading thumbnail…

Sol Lewitt Variante

This example recreates a Sol LeWitt-inspired wall drawing as an interactive SVG visualization. The artwork shows a grid of thin horizontal and vertical lines that are visible only within two overlapping circular masks, creating a crosshatched pattern inside the circles against a blank background. The code uses plain JavaScript with the SVG DOM API, creating mask elements and hundreds of rect primitives programmatically. A black-filled mask with a white circle reveals the horizontal lines, while an inverted mask with a black circle reveals the vertical lines, demonstrating a simple yet effective clipping technique.

Iibaird6@gatech.edu

88% match