Skip to main content
SimilarExport ZIP
100%

4_Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
DddG12g
Last edited Sep 12, 2023
Created on Sep 11, 2023

This piece uses D3.js within an SVG framework to create a geometric composition inspired by Sol LeWitt. It displays a central circular window formed by two overlapping masks—one creating a circular hole, the other creating a surrounding ring—through which horizontal and vertical striped rectangles pass. The artwork is generated procedurally by creating a mask element with a circle, applying it to a series of rect elements, then repeating the process with inverted colors for a second layered set of lines. The D3 import is present but unused; all shapes are built via direct SVG DOM manipulation.

AI-generated description

Source datavizcatalogue

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol LeWitt Reproduction with D3

This piece recreates a Sol LeWitt wall drawing using D3.js to generate layered, mask-based geometric forms. It displays a grid of horizontal and vertical lines that intersect within a central circular region, creating a dynamic visual pattern. The code uses the D3 selection API and raw SVG elements, employing two circular masks to selectively reveal the line structures. The rendering is dynamically sized to fit the browser window, producing an interactive, generative art experience.

Ssean@wall.ninja
91% match
Loading thumbnail…

Sol LeWitt Reproduction with D3-episode 04

This piece displays a visual grid of alternating horizontal and vertical strips that are revealed through two contrasting circular masks. Built with the D3 library (version 6.6.1), it generates 100 semi-transparent rectangular bands in each orientation, with one mask using a black background and the other using white to invert the visible regions. The composition forms an intersecting pattern that echoes Sol LeWitt’s geometric style, rendered entirely through programmatic SVG element creation.

Mmaxthamt
90% match
Loading thumbnail…

Sol LeWitt Reproduction in D3

This example recreates a Sol LeWitt-inspired geometric composition using D3.js. It renders a grid of horizontal and vertical SVG rectangles across the full window, with each set masked to reveal intersecting circular cutouts at the center. The visualization relies on d3.select, d3.range, and SVG mask elements to layer two sets of stripes, alternating black and white fills within the circles. The result is a clean, minimal pattern that mimics the artist’s systematic approach to drawing, with no data input beyond the generated grid dimensions.

Mmaciekawsq@gmail.com
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt piece, displaying a grid of horizontal and vertical lines masked to reveal a central circle. The artwork uses 100 horizontal and 100 vertical rectangles, each 10 pixels thick, with a circular mask applied to create the intersecting form. Built with D3.js (v6.6.1), the code uses `select`, `range`, and the `append` and `attr` methods to construct and style the SVG elements directly, dynamically sizing the piece to the browser window.

Ttriciascully
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3 AG

A D3.js reproduction of a Sol LeWitt art piece renders a grid of horizontal and vertical bars on a full-window SVG canvas. Two mask elements with contrasting black-and-white fill patterns clip the bars, creating a circular window at the center that reveals the layered strip intersections. The code uses `select`, `range`, `join`, and `attr` to generate 100 rectangles in each direction, with `append('mask')` defining the circle masks. The composition directly reflects LeWitt's geometric, rule-based aesthetic through D3's data-driven SVG generation.

Gguththered
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3.js

A D3.js reproduction of a Sol LeWitt art piece uses 100 horizontal and vertical striped rectangles overlaid with two circular SVG masks to create a geometric grid pattern with an intersecting circle. The horizontal bars are masked by a black background with a white circle, while vertical bars use an inverse white mask with a black circle, producing a contrasting visual effect. Built with d3.select and d3.range, the SVG rendering fills the entire browser window. The code includes commented-out decoupled and vanilla JavaScript alternatives.

MMarcus Vinicius da Silveira Richa
89% match
Loading thumbnail…

Sol LeWitt Reproduction with D3

A D3.js reproduction of a Sol LeWitt art piece renders 100 horizontal SVG rectangles at staggered y-positions, each masked by a circular cutout centered on the viewport. The code uses d3.select to append an SVG element sized to the window, binds data via .data() and .join(), and applies a reusable mask defined with SVG’s mask and circle elements. The resulting composition layers thin striped bands inside a circular aperture, evoking LeWitt’s geometric wall drawings. Rendering is done entirely with declarative SVG attributes, with no external data source.

Cchacon1@uic.edu
89% match
Loading thumbnail…

D3 Sol LeWitt Reproduction

This D3.js example reproduces a Sol LeWitt wall drawing using generated SVG rects and masks. It creates two circular masks over a grid of horizontal and vertical bars, with one mask inverting the circle to show a ring pattern. The visualization uses native SVG mask elements and the d3 selection API, though the rendering is primarily procedural JavaScript manipulating the DOM. The piece fills the browser window dynamically using window dimensions, generating 100 rects in each orientation.

IIndranil Biswas
89% match