Skip to main content
SimilarExport ZIP
100%

Fork of Full Sol LeWitt Reproduction with D3

✓ Published1🌍 Public
Nnim@brejnholt.dk
Last edited Jan 22, 2024
Created on Jan 22, 2024

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.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

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
93% 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 Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using two overlapping sets of thin horizontal and vertical rectangles. The drawing applies two distinct SVG masks to each set, creating a crosshatched grid that visually inverts where the shapes intersect. Built with D3 v6, it generates 100 rectangles per axis using `range` and `selectAll().join()`, while the `symbol` API draws a diamond-shaped mask path. The final SVG adapts to the full browser window size, with masks rendered through appended `<mask>` elements.

DDuckGorilla
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 Final with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3.js, rendering a grid of thin horizontal and vertical rectangles on an SVG canvas. Two masks—one with a white background and black diamond shape, the other inverted—overlay the grid, so the lines are partially visible through the cutout areas. The code uses d3.select, d3.range, and d3.symbol to generate the shapes and apply the mask effects. The final artwork is static, with masks and grid lines defined programmatically at full window dimensions.

Kkwambokar
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
91% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3 v7, displaying 100 horizontal and vertical striped rectangles that overlap to create a grid pattern. Two SVG masks, each containing a large diamond symbol, selectively hide portions of the stripes, revealing the geometric interplay between the layers. The code uses `d3.select`, `d3.range`, and `d3.symbol` to generate the shapes, with masks defined via SVG `<mask>` elements and rendered as a static SVG scene.

Gguts
91% match
Loading thumbnail…

Fork of Fork of Full Sol LeWitt Reproduction with D3

This example creates a dynamic grid of horizontal and vertical stripes that form a generative composition, reminiscent of a Sol LeWitt drawing. It renders 100 lines in each direction, with their visibility altered by two SVG masks containing paths generated from D3’s `symbol` API. The masks invert the stripes’ appearance, creating intersecting shapes across the canvas. The code uses D3’s `select`, `range`, and `join` to build the SVG elements, with the mask logic defined in a custom `renderMask` function.

Rraturi22@gmail.com
91% match