Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
NNyashaBradleymhepo
Last edited Jul 19, 2023
Created on Jul 19, 2023

This example reproduces a Sol LeWitt-inspired geometric pattern using D3 v6 and SVG rendering. It displays a grid of horizontal and vertical rectangles overlaid with two circular masks, creating a layered, minimalist composition of intersecting lines and a central void. The visualization uses `d3.select`, `d3.range`, and `.join()` to generate 100 rectangles in each orientation, while SVG `<mask>` elements define the circular cutouts. The `circle-mask` uses a black background with a white circle, while `circle-mask-2` inverts the effect, producing contrasting visual regions across the full viewport.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt-inspired geometric composition using D3 version 6. It displays a grid of alternating horizontal and vertical black rectangles, masked to reveal a central white circle against a dark background, creating a cross-hatched circular motif. The code uses `d3.select`, `range`, and data joins (`.join()`) to generate SVG `<rect>` elements dynamically. Two SVG masks (`circle-mask` and `circle-mask-2`) with white and black circles, respectively, control which parts of the overlapping stroke pattern remain visible. The rendering is entirely SVG-based, with dimensions set to the full browser window.

SSinasirousnejad
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3.js version 6 and SVG rendering. The visualization shows a grid of horizontal and vertical rectangles, with two circular masks creating a layered geometric pattern where the lines alternate visibility. The code employs `d3.select`, `d3.range`, and the `join` method to generate 100 rect elements for each orientation. SVG masks—defined with distinct IDs and circles of white and black fills—control which line segments appear within the overlapping circular regions.

PPeter Prevos
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3 v7. It displays a grid of overlaid horizontal and vertical rectilinear lines, with a circular region in the center where the horizontal lines are visible and the vertical lines are masked out. The visualization uses two SVG `<mask>` elements, `circle-mask` and `circle-mask-2`, to selectively hide or reveal line groups, creating an inverted circular contrast. All shapes are rendered as SVG rectangles, sized to the full window, with 100 lines spaced evenly in each direction. The code relies on `d3.select`, `d3.range`, and SVG attribute manipulation.

Aajoua
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt-inspired geometric composition using D3 v3. It displays a grid of thin, alternating horizontal and vertical rectangles whose visibility is selectively masked by two overlapping circular cutouts, creating a layered, minimalist pattern. The implementation uses `d3.select` and `d3.range` to generate 100 rectangles in each direction, applies SVG `mask` elements with white and black fills for inversion, and positions the circles at the canvas center with a radius of 200 pixels. Rendering is done entirely via SVG, sized to the full browser window.

YYingkai Song
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3.js. It displays a grid of horizontal and vertical rectangles that are partially visible through a circular mask, creating an intersecting line pattern. The visualization uses D3’s `select`, `append`, and `join` methods to dynamically generate SVG `rect` elements and mask definitions. The code defines two SVG masks—one circular and one inverted—to selectively reveal the shapes, with the page sized to the full browser window. The rendering is entirely SVG-based, with no external data source.

Bbeyzadoganay
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition, generating a grid of overlaid horizontal and vertical stripes that are masked to reveal a central circle. The visualization uses D3 v6 to create an SVG scene, drawing 100 rectangles in each orientation and applying two masks with contrasting black-and-white circular cutouts to shape the final pattern. The rendering fills the entire browser window, with the circle positioned at the center of the viewport.

DDuckGorilla
92% match
Loading thumbnail…

Full Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3 v6. It renders a grid of alternating horizontal and vertical rectangles, with two overlapping circular masks creating a layered black-and-white optical effect at the center of the canvas. The code uses `d3.select`, `d3.range`, and the `.join()` method to bind data to SVG `<rect>` elements, while `<mask>` elements with circles define the visible regions. The visualization fills the entire browser window, with the artwork built entirely from SVG shapes and no external data sources.

PPedram
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example renders a Sol LeWitt-inspired geometric composition using D3 v6 in an SVG container. It draws 100 horizontal and 100 vertical rectangular bands across the full viewport, each masked to reveal circular cutouts at the center. Two SVG masks (`circle-mask` and `circle-mask-2`) apply inverse fill patterns—one black with a white circle, the other white with a black circle—so the overlapping stripes form a crosshatched grid with a circular void. The visualization uses `d3.select`, `d3.range`, and data joins via `.join('rect')` to generate the marks.

Yyankesswang
92% match