Skip to main content
SimilarExport ZIP
100%

Full Fork of Fork of Sol LeWitt Reproduction with D3

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

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', ...)`.

AI-generated description

Sol Lewitt repro

MIT Licensed

Similar vizzes

Loading thumbnail…

Full Fork of Fork of Sol LeWitt Reproduction with D3_progress

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.

Ppawelsapiecha
94% 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
93% 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
93% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt-style geometric composition using overlapping horizontal and vertical stripes. Two sets of SVG rectangles are drawn across the full width and height of the viewport, each filtered through a separate SVG mask. The masks reveal or hide portions of the stripes using a row of D3 symbol shapes (from `d3.symbol`), with one mask inverted. The visualization uses D3 v6 selections, `range`, and `join` to generate the elements, and renders entirely as SVG in the browser.

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

This example reproduces a Sol LeWitt-inspired geometric composition using D3 v7, rendering two sets of overlapping horizontal and vertical stripes on an SVG canvas. The stripes are filtered through mask elements that reveal different symbol glyphs—circles, crosses, and other d3.symbol shapes—positioned along the center. The code uses d3.select, d3.range, and d3.symbol to generate the paths, with masks applied via SVG attributes. The artwork alternates mask inversion to create contrasting positive and negative space across the full window dimensions.

IIgorGorin00
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3 to create a grid of horizontal and vertical stripes that alternate based on masks containing overlapping symbol shapes. Two sets of rectangular bands are drawn, each masked by a pattern of symbols (using `d3.symbol` and `d3.symbols`) arranged across the width via `d3.scaleBand`, with inverted black-and-white fills. The SVG rendering uses `select`, `range`, and `join` to generate 120 stripes per dimension, with masks (`<mask>`) controlling which areas of the two layers remain visible. The result is a geometric interplay of lines and icons derived from LeWitt’s conceptual style.

Jjsoudeer
92% match
Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece by layering vertical and horizontal striped rectangles, masked by geometric symbols to create intersecting patterns across the full screen. It uses D3 selections and joins to render 100 rect elements in each orientation, with alternating masks that reveal or hide the stripes through symbol shapes. The SVG output is generated dynamically based on window dimensions, and the masks combine D3's `symbol` and `range` APIs to position five distinct marker types. The code imports only `select`, `range`, `symbols`, and `symbol` from D3 v7.3.0.

SSamuele Greco
92% match