Skip to main content
SimilarExport ZIP
100%

Fork of Full Sol LeWitt reproduction with D3_2

✓ Published0🌍 Public
DDilara Bozkurt
Last edited Jan 5, 2025
Created on Jan 5, 2025

This visualization reproduces a Sol LeWitt art piece using D3.js, displaying a grid of vertical and horizontal striped rectangles overlaid with masked geometric symbols. The code employs D3 selections and data joins to generate 100 rectangles in each direction, while `d3.symbol` and `d3.symbols` create the diamond and triangle shapes used in the masks. Two SVG masks, defined via the `renderMask` function, apply the symbols as cutouts in alternating black-and-white fills, revealing the striped pattern through the shapes. The rendering uses SVG with dynamic window dimensions, and the masks are applied with inverted fill states to create the final layered composition.

AI-generated description

Sol LeWitt art piece reproduction

MIT Licensed

Similar vizzes

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

Fork of Fork of Full Sol LeWitt reproduction with D3

This example reproduces a Sol LeWitt art piece using D3 v7 and SVG. It generates two sets of striped rectangles—horizontal and vertical—layered over each other. The code applies two complementary SVG masks, each containing a row of D3 symbol shapes, to selectively reveal or hide parts of the grid. The masks are created programmatically with the `renderMask` function, which uses `d3.range`, `d3.symbol`, and `d3.symbols` to position the mask shapes across the canvas. The final result creates an intricate, textured interplay between the geometric lines and the symbol cutouts.

ZzolboBatsaikhan
93% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This visualization recreates a Sol LeWitt wall drawing using D3.js, generating a grid of horizontal and vertical bars that intersect to form a dynamic pattern. The code draws 100 rectangular strips in each direction, using SVG masks to selectively hide portions of the grid with large mathematical symbols. The artwork relies on `d3.range`, `d3.select`, and `d3.symbol` to construct the visual, with the mask system alternating between inverted and non-inverted states to create contrasting regions across the canvas.

Aadityapalliyil0@gmail.com
92% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition as an interactive SVG visualization. It renders 100 horizontal and vertical stripes that intersect to form a grid, with a mask applied to reveal a diamond-shaped symbol in the center. The code uses D3’s `select`, `range`, `symbol`, and `symbols` APIs to generate the shapes and masks, while `renderMask` creates two complementary mask layers. The visualization fills the browser window and is built entirely with SVG elements in D3 v6.

Zzhuomo-maker
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 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 Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3.js, displaying a grid of alternating horizontal and vertical striped lines across the full browser window. Two SVG masks reveal the grid through circular and geometric shapes, while the second mask incorporates D3 symbol shapes and checkerboard patterns within its design. The code uses D3 v7 APIs including `select`, `range`, `symbol`, and `symbols` to generate the SVG elements, with mask composition controling which portions of the line grid remain visible.

AAngie Va. Moreno
92% match