Skip to main content
SimilarExport ZIP
100%

Full Fork of Fork of Sol LeWitt Reproduction with D3_progress

✓ Published2🌍 Public
Ppawelsapiecha
Last edited Oct 24, 2022
Created on Oct 23, 2022

This example generates a grid of horizontal and vertical rectangles overlaid with two masks, producing a Sol LeWitt-inspired pattern. Each mask contains a row of distinct d3 symbols (from `d3.symbols`), rendered via `d3.symbol` with a fixed size, positioned along the canvas center. The first mask uses non-inverted fill, while the second is inverted, causing the symbol shapes to cut through or reveal the striped background. The visualization relies on D3 v7’s `select`, `range`, and `join` to bind data and construct SVG elements, with masks defined and applied through custom SVG `<mask>` elements.

AI-generated description

Sol Lewitt repro

MIT Licensed

Similar vizzes

Loading thumbnail…

Full Fork of Fork of Sol LeWitt Reproduction with D3

A grid of horizontal and vertical striped rectangles is revealed through two overlapping masks, creating a dynamic composition where the stripes intersect and fade. The visualization uses D3 v7's `select`, `range`, and `join` to generate 100 rows and columns of semi-transparent rectangles. Two SVG masks, each containing a large circle symbol from `d3.symbol`, invert their fill to selectively hide and show portions of the stripe layers, producing a lens-like effect. The rendering is entirely SVG-based, with masks applied via `.attr('mask', ...)`.

Ppawelsapiecha
94% match
Loading thumbnail…

Fork of Fork of Full Sol LeWitt Reproduction with D3

This visualization recreates a Sol LeWitt–style grid of horizontal and vertical lines, overlaid with two masks that reveal symbolic shapes in contrasting areas. The example uses D3 v6 to generate 100 rectangular strips in each direction, then applies SVG masks via `d3.select` and `append('mask')`. Each mask uses D3 symbol generators (`d3.symbol` and `d3.symbols`) to draw numbered geometric icons—circles, crosses, diamonds, and squares—in black or white, creating a layered optical effect. The code directly manipulates SVG elements and relies on the `range`, `join`, and `attr` APIs to build the repeating structure.

AAlpineStranger
92% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3 version 7. It displays a grid of horizontal and vertical lines overlaid with two masks, each containing a row of distinct geometric symbols. The horizontal lines are masked by one set of symbols, while the vertical lines are masked by an inverted set, creating a layered, intertwined visual effect. The code uses `d3.select`, `d3.range`, and `d3.symbol` to generate SVG shapes and `append('mask')` to apply the masking logic dynamically.

Aajoua
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 using D3 to generate a grid of alternating horizontal and vertical rectangles. The rectangles are masked by two overlapping circular symbols, one inverted, to create the final visual composition. The code leverages `select`, `range`, `symbol`, and `symbols` from D3, rendering SVG shapes across the full window dimensions. The masks are built with appended `mask` elements and paths, using D3’s `join` for efficient data binding.

Rroyable88
91% match
Loading thumbnail…

Fork of Full Fork of Fork of Sol LeWitt Reproduction with D3_final

Two alternating sets of thin rectangles and masked symbol shapes form an abstract, geometric composition reminiscent of Sol LeWitt's wall drawings. The code uses D3 v7 with `select`, `range`, and `symbol` to append SVG rectangles whose positions and dimensions alternate between horizontal and vertical lines. A mask, built via `append('mask')`, overlays diamond and square symbols from `d3.symbols`, with alternating black and white fills that reveal or hide the underlying grid. The result is a dynamic interplay of line, shape, and contrast driven by parity-based logic.

Ppawelsapiecha
91% match
Loading thumbnail…

Fork of Sol Lewitt Reproduction with D3

This example generates an abstract grid pattern using Sol Lewitt-inspired geometry. It draws horizontal and vertical strips of rectangles, then applies two distinct masks with D3’s `symbol` shapes (including circles, crosses, and diamonds) to selectively reveal or hide portions of the grid. The masks are created with `d3.mask`, one inverted against the other, producing a layered interplay between the symbol silhouettes and the underlying striped composition. The visualization uses D3 v7 selections, `range`, and `join` to construct the SVG elements within a full-window viewport.

Aaidarshafeev1@gmail.com
91% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

A grid of horizontal and vertical black lines forms a full Sol LeWitt–style drawing, masked by overlapping diamond shapes to reveal alternating line orientations. Using D3 v7, the code creates 100 horizontal and 100 vertical rectangles on an SVG canvas, each masked via `d3.mask` with a large `symbol` path. The `renderMask` function appends SVG `<mask>` elements, using `select.append` and `attr` to set fill colors and transforms, producing the final geometric pattern.

Nnim@brejnholt.dk
91% match