Skip to main content
SimilarExport ZIP
100%

FULL sol l. reprod. w/ d3

✓ Published1🌍 Public
Kkhaledakanan@gmail.com
Last edited Jun 8, 2024
Created on Jun 8, 2024

This visualization recreates Sol LeWitt’s geometric art by using alternating horizontal and vertical bars to form a grid-like pattern. The bars are masked by two overlapping shapes—a circle and an inverted circle—which create intersecting voids in the composition. The code relies on D3’s `select`, `range`, `symbol`, `symbols`, and `mask` APIs to generate SVG elements dynamically. The layout is calculated from the viewport dimensions, and the rendering is entirely SVG-based with no external data source.

AI-generated description

A recreation of Sol LeWitt's Art

MIT Licensed

Similar vizzes

Loading thumbnail…

sol l. reprod. w/ d3 (group elements)

This visualization recreates Sol LeWitt’s art using D3 version 6.6.1 to draw a grid of horizontal and vertical SVG rectangles. Two overlapping masks, defined via `mask` and `circle` elements, reveal the rectangular marks only inside a large central circle, creating a crosshatched pattern that fades into empty space. The code uses `d3.select`, `range`, and `join` to generate the shapes dynamically based on the viewport dimensions.

Kkhaledakanan@gmail.com
92% match
Loading thumbnail…

sol l. reprod. w/ d3 (classes)

An interactive recreation of Sol LeWitt's geometric art uses D3.js to draw two alternating sets of thin SVG rectangles: horizontal bands across the full screen and vertical bands intersecting them. A circular mask reveals the overlapping pattern in the center, while inverted masks create a negative space effect. The code leverages `d3.select`, `d3.range`, and `svg.attr` to generate the repeating grid structure.

Kkhaledakanan@gmail.com
91% match
Loading thumbnail…

Full Sol LeWitt reproduction with D3_2

This visualization reproduces a Sol LeWitt drawing using overlapping vertical and horizontal bars. The bars are drawn as SVG rectangles, with alternating masks creating a visual interplay between the two orientations. The code uses D3.js’s `select`, `range`, `symbol`, and `symbols` APIs to generate the geometric grid and mask patterns. It relies on D3’s SVG rendering with dynamic mask definitions to achieve the layered, cross-hatched effect. The data is procedurally generated rather than sourced from an external dataset.

DDilara Bozkurt
91% match
Loading thumbnail…

Full Sol Levitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired drawing using D3.js, rendering a grid of horizontal and vertical bars that are partially masked to create an interplay of solid and negative space. The visualization fills the entire browser window, with each bar’s position and thickness calculated from the window dimensions. The code employs D3’s `select`, `range`, and `symbol` APIs to generate SVG shapes and masks. Two `mask` elements, one inverted, apply a large circular path as a cutout, alternating which set of lines is visible through the circle, demonstrating core SVG masking techniques within a generative art context.

SSimon Krukowski
89% match
Loading thumbnail…

Full of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition using D3.js, rendering a full-screen SVG grid of overlapping horizontal and vertical bars. Two distinct masks, created with inverted black-and-white shapes from D3’s `symbol` API, selectively reveal or hide portions of the grid, producing layered, intersecting patterns. The code uses D3’s `select`, `range`, and `join` methods to efficiently generate and update the 100 rectangles per orientation, while the `mask` elements dynamically apply the symbolic clipping paths. The final visualization is a clean, generative art piece driven entirely by SVG and D3’s declarative API.

Jjmetzg11alpine
89% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This visualization reproduces a full Sol LeWitt art piece using D3, displaying a grid of horizontal and vertical stripes that are selectively masked by geometric symbols. The artwork shows alternating bands of lines, with the vertical stripes masked by filled shapes and the horizontal stripes partially obscured. The code uses D3’s `select`, `range`, and `symbols` APIs to generate SVG rectangles and mask paths, rendering 100 lines in each direction across the full browser window. Two separate masks apply contrasting white and black fills to create the overlapping pattern effect.

PPareel Amre
89% match
Loading thumbnail…

Full Sol LeWitt reproduction with D3

This visualization reproduces a Sol LeWitt art piece, featuring two sets of parallel lines that are masked to create a circular composition. The piece shows vertical and horizontal bands intersecting, with a central circular area where the line pattern is inverted. Built with D3.js, the code uses `range`, `select`, `symbols`, and `symbol` to generate SVG rectangles and a mask, applying the geometric abstraction in a dynamic, full-screen format. The rendering is purely SVG-based, with masks defining the circular interplay of the line grids.

ZzolboBatsaikhan
89% match
Loading thumbnail…

Sol LeWitt Reproduction With D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3.js, displaying a grid of horizontal bars that form a circular cutout in the center. The visualization shows 100 thin, full-width rectangles stacked vertically across the screen, with a circular mask applied to create a negative-space circle in the middle of the canvas. The code leverages D3’s `select`, `range`, and data-join methods to generate the SVG rectangles, while an SVG `<mask>` element containing a black rectangle and white circle defines the visible region. The rendering uses the D3 v7 library and outputs vector-based SVG graphics that fill the entire browser viewport.

PPrince Kumar
89% match