Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
Aaissatheprogrammer
Last edited Nov 29, 2022
Created on Nov 23, 2022

This example reproduces a Sol LeWitt-style geometric composition using D3 version 6.6.1, rendering directly to an SVG element. The visualization fills the entire browser window by setting the SVG dimensions to the screen width and height, and begins by drawing a single black circle at a fixed offset. The code imports `select` and `range` from D3, though only `select` is currently used to append the SVG and circle, leaving the artwork's full structure incomplete. The rendering approach relies on basic SVG primitives within an HTML page that hides scrollbars for a clean, full-screen presentation.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3 version 6.6.1, rendering geometric symbols as black rectangles positioned across a full-screen SVG. The code imports `select`, `range`, `symbols`, and `symbol` from D3, splitting the viewport into sections based on symbol index and using chained joins to append groups and rects. Although much of the drawing logic is commented out, the visible code demonstrates placement of twenty-pixel squares anchored to predefined coordinates. The rendering approach relies on SVG elements, with the page configured to hide overflow for a clean, immersive display.

BBenLeathers
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3 and SVG. It uses `select` to create an SVG canvas and `range` to generate data for drawing a grid: horizontal and vertical rectangles are appended with `.join('rect')`. Two SVG mask elements (`circle-mask` and `circle-mask-2`) reveal the grid through a central circular opening, with one mask inverting the other to create a contrasting effect. The visualization runs at full browser window size using D3 version 6.6.1.

JJeppeOEM
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3. It draws a grid of horizontal and vertical rectangles that are masked by two circles, creating a pattern of alternating lines within circular cutouts. The code uses D3’s `select` and `range` functions to generate SVG elements, and applies SVG masks with `circle` elements to clip the rectangles. The artwork is rendered as an SVG, filling the browser window.

Rrwata97
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3, rendering nine circles in a sine-wave pattern across an SVG canvas sized to the browser window. The visualization shows how simple geometric elements can create an organic, rhythmic composition. It uses D3's `select` API to append an SVG element to the body and `selectAll('circle').data(data).enter()` to generate the circles, with positions calculated using the `Math.sin` function for the vertical offset. All drawing is done via SVG vector graphics.

DDutch Hansen
91% match
Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction with D3

This D3.js (version 7.8.5) reproduction of a Sol LeWitt art piece generates an SVG canvas filling the browser window. It draws 100 horizontal and 100 vertical bands of alternating dimensions, each masked to create a circular intersection pattern. The code uses D3’s `select`, `append`, `range`, and `data().join()` API to generate the SVG elements. Two SVG masks (`circle-mask` and `circle-mask-2`) control visibility, with the second inverting the circular mask to create complementary transparency effects.

Bbtlhgboy@icloud.com
90% match
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
90% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3, rendering 100 horizontal and 100 vertical rectangles that intersect in a grid-like pattern. The visualization shows a central circular area where the rectangles are visible, while the surrounding regions are masked out. It uses d3.select to create an SVG, d3.range with data joins to generate the rectangles, and SVG mask elements with circles to create the circular cutout effect. The code iterates through both orientations to layer the marks.

Aaalyousfi
90% match
Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt-inspired geometric composition using D3's selection and data-join methods. It renders 100 horizontal and 100 vertical rectangles across the full viewport, with each set masked by a circular cutout at the center—one mask inverts the other, creating a striking interlocking grid pattern. The visualization uses D3 v6's `select`, `range`, and `append` APIs to construct the SVG elements and masks, with the circle radius fixed at 200 pixels. The code demonstrates how layered SVG masks can produce complex visual effects from simple rectangular primitives.

MMohammed
90% match