Skip to main content
SimilarExport ZIP
100%

Fork of Full Sol lewitt reproduction with D3 - not using class JVK

✓ Published1🌍 Public
Kkakkanadjoy@yahoo.com
Last edited Dec 19, 2024
Created on Dec 19, 2024

This visualization recreates a Sol LeWitt-style geometric composition using intersecting horizontal and vertical bands masked by two diamond shapes. The bands alternate between visibility and inversion, creating a layered optical effect. Built with D3.js v7, the code generates 100 rectangles along each axis and applies SVG masks using the `symbol` and `symbols` APIs to produce the central diamond cutouts. The rendering is entirely SVG-based, with the mask elements dynamically appended via a reusable `renderMask` function.

AI-generated description

A Sol Lewitt ReproductionSol Lewitt art piece

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Full Sol lewitt reproduction with D3 - not using class JVK

This visualization reproduces a Sol LeWitt wall drawing using D3.js, rendering a grid of horizontal and vertical stripes across the entire browser window. Two SVG masks, each containing a set of geometric symbols, apply contrasting cutout effects to the stripe layers, creating a dynamic interplay between positive and negative space. The code uses D3’s selection, range, and symbol APIs to generate the patterns and masks, with the SVG output sized to the viewport. The artwork draws on LeWitt’s conceptual instructions, here implemented programmatically rather than by hand.

Kkakkanadjoy@yahoo.com
91% match
Loading thumbnail…

Fork of Full Sol LeWitt reproduction with D3_2

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.

DDilara Bozkurt
89% 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
89% 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
89% match
Loading thumbnail…

Fork of Full Sol LeWitt Reproduction in D3 - Javan

This example reproduces a Sol LeWitt wall drawing using D3.js to generate a grid of horizontal and vertical stripes, with geometric symbols cut out through SVG masks. The code creates 100 rectangular bands in each direction, then applies two complementary masks—one with dark symbols on a light background, the other inverted—to reveal layered patterns. The visualization uses D3’s `select`, `range`, `symbol` and `symbols` APIs, along with SVG `<mask>` elements, to compose the artwork across the full browser window.

JJavan Friedel
88% 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
88% match
Loading thumbnail…

Fork of Full of Joe LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric drawing using a grid of horizontal and vertical stripes that interact through two SVG masks to reveal a central diamond shape. The visualization populates 100 rectangles in each direction, sized relative to the window, and applies the masks with inverted fills to create the overlapping cut-out effect. Built with D3 v6, it uses the `select`, `range`, `symbol`, and `symbols` APIs to construct the SVG elements and generate the diamond path.

Ccssergio
88% 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
88% match