Skip to main content
SimilarExport ZIP
100%

Fork of Full Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
Wwspwll@gmail.com
Last edited Jul 15, 2024
Created on Jul 15, 2024

A Sol LeWitt-inspired generative drawing fills the browser window with a grid of horizontal and vertical black lines. The piece uses D3 to render two sets of rectangles, each masked by a custom SVG mask. One mask reveals a pattern of geometric symbols—circles, squares, and triangles—while the other inverts the effect, creating a layered, intersecting composition. The masks are built with D3's `symbol` API, and the SVG elements are positioned using `range` and `selectAll` with `join`. The rendering is entirely SVG-based, with the artwork sized to the viewport.

AI-generated description

A reproduction of a Sol LeWitt art piece with D3.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

A fork of a Sol LeWitt reproduction uses D3 to render intersecting horizontal and vertical line bands, each filtered by a mask that reveals a row of geometric symbols. The code generates 100 rectangles per axis, spaced at 20-pixel intervals, and applies separate masks created with D3’s `symbol` and `symbols` API. The SVG output relies on D3 selections, `range`, and mask definitions to alternate inverted fills, producing an abstract, generative pattern across the full viewport.

Ddalia.miliauskaite@me.com
93% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3.js, rendering a grid of horizontal and vertical rectangles that intersect through SVG masks. The code creates 100 evenly spaced lines in each direction, then applies two complementary masks—one normal and one inverted—to reveal or hide the grid patterns. Using D3 selections, `range`, and symbol generators, the masks incorporate circular, triangular, and other symbolic shapes. The artwork is dynamically sized to the viewport and rendered as an SVG, demonstrating how D3’s data-join and mask primitives can build layered generative art.

XXuân Vinh
92% match
Loading thumbnail…

Fork of Fork of Full Sol LeWitt Reproduction Final with D3

This example draws a generative grid inspired by Sol LeWitt using SVG and D3. It fills the viewport with 100 horizontal and 100 vertical stripes, each masked so that only parts of the grid remain visible. Two separate masks, created with d3.mask, contain large D3 symbols (from d3.symbol) that act as cutouts or reveals, inverting their effect between the axes. The code uses d3.select, d3.range, and d3.symbol to build the composition programmatically, producing a layered geometric pattern that plays with visibility and form.

Kkwambokar
92% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece by rendering a grid of horizontal and vertical lines on an SVG canvas. The lines are masked to reveal a circular pattern, with the mask itself containing a defined symbol, creating an interplay between the geometric lines and the circular cutout. The visualization uses the D3 library, including its `select`, `range`, and `symbol` APIs, to generate the SVG elements and masks. It fills the entire browser window, with both horizontal and vertical lines each having a thickness of 10 pixels, spaced 20 pixels apart.

CCurran Kelleher
92% match
Loading thumbnail…

Fork of Full of Sol LeWitt Reproduction with D3

A D3.js reproduction of a Sol LeWitt art piece renders a grid of thin horizontal and vertical rectangles across the full browser window. The code uses `d3.range()` and `d3.select` to generate 100 rows and columns, then applies two SVG masks to shape the overlapping lines. Each mask contains a large `d3.symbol` with a star shape, defined via `symbol(symbols[1], 100000)`, which cuts a circular diamond pattern out of the otherwise regular grid. The masked rectangles create a layered visual where lines appear through the star-shaped holes, demonstrating SVG mask composition with D3 selections.

IIgorGorin00
92% match
Loading thumbnail…

Fork of Full Sol Levitt Reproduction with D3

This example reproduces a Sol LeWitt wall drawing as a generative SVG composition. It renders a grid of thin horizontal and vertical lines across the full browser window, using a mask to create overlapping geometric patterns. The code builds two masked layers with `d3.select`, `d3.range`, and a custom `renderMask` function, applying contrasting black-and-white fills to shape the visible linework. Built with D3 v6, the visualization demonstrates SVG shape construction and masking techniques.

SSimon Krukowski
92% match
Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction by D3 2

A D3.js reproduction of a Sol LeWitt drawing fills the browser viewport with a grid of horizontal and vertical bars layered on top of each other. Two SVG masks, each containing differently shaped symbols from `d3.symbol` and `symbols`, selectively reveal parts of the grid. The first mask applies a non-inverted pattern, while the second uses an inverted fill, creating a dynamic interplay between the geometric bars and symbol silhouettes. Rendered entirely with SVG elements and styled through CSS, the code uses `select`, `range`, and `join` to generate the repeating bars.

Aaaron.00366@gmail.com
92% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

A fork of the Sol LeWitt wall drawing reproduction renders a grid of horizontal and vertical stripes, each masked by a circular form, on an SVG canvas that fills the browser window. The piece uses the D3.js API, specifically `select`, `range`, and the `join` method, to generate the stripes, while masks are created with `symbol` and `symbols` to imprint the circle. The result is a geometric interplay of lines and negative space, driven entirely by D3's declarative data-binding and SVG rendering.

Lliu yang
92% match