Skip to main content
SimilarExport ZIP
100%

Fork of GiRiB&W_Ep4-Sol_LeWitt-FullRepo Ex V2

✓ Published0🌍 Public
Kkathrynrbernard
Last edited Jan 6, 2023
Created on Jan 6, 2023

This generative art piece reproduces a Sol LeWitt-inspired drawing using intersecting, masked striped rectangles. The work builds a grid of horizontal and vertical bars, which are selectively revealed through D3.js masks that contain geometric symbols from the `d3.symbols` API. Using D3 6.6.1, the code iteratively creates rectangles for each axis and applies custom SVG masks, using paths for rendering symbols like circles or crosses. The composition creates layered, overlapping forms driven by programmatic ranges and the `select`, `range`, and `join` functions.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

GiRiB&W_Ep4-Sol_LeWitt-FullRepo Ex V2

A generative black-and-white composition reproduces a Sol LeWitt-style grid, layering horizontal and vertical bars across the full viewport. The piece alternates masked regions filled with geometric symbols from the D3 symbol set, splitting the canvas into six equal sections with alternating inverted palettes. Using D3 v6 selection and data-join methods, the code constructs four SVG mask groups, each combining rectangles and paths to create overlapping positive and negative spaces. The visualization relies entirely on SVG rendering and D3’s `symbol` and `symbols` APIs to draw the abstract forms.

JJimMaltby
88% match
Loading thumbnail…

GiRiB&W_Ep3-Sol_LeWitt-FullRepo-pt1

A generative black-and-white composition reproduces a Sol LeWitt-inspired wall drawing using intersecting grids of horizontal and vertical bands. Two D3 masks define contrasting circular cutouts at the center, where one mask inverts the visible area and the other reveals it. Built with d3-selection, `range`, and `symbol` from D3 v6, the rendering uses SVG paths and rectangles to layer the striped fields. The artwork runs full-window in an HTML page with JavaScript.

JJimMaltby
87% match
Loading thumbnail…

GiRiB&W_Ep4-Sol_LeWitt-FullRepo Ex

This example recreates a Sol LeWitt-inspired grid of horizontal and vertical lines that are partially revealed by two SVG masks containing geometric shapes and D3 symbols. The code uses D3 selections and data joins to draw one hundred alternating stripes across the screen, while the `renderMask` function builds each mask with rectangles and paths generated from `d3.symbol` glyphs. Rendered as an SVG, the piece uses black and white fills to create a dynamic interplay between the line grid and the symbolic cutouts.

JJimMaltby
87% match
Loading thumbnail…

GiRiB&W_Ep3-Sol_LeWitt-FullRepo-pt3

This visualization reproduces a Sol LeWitt-style geometric composition using a grid of horizontal and vertical rectangles. The code generates 100 stripes in each direction, applying two distinct masks that reveal a white diamond shape within a black background and its inverse, creating overlapping layered effects. Built with D3.js (v6.6.1), it leverages `select`, `range`, `join`, and `symbol` APIs to construct SVG elements and masks. The rendering is entirely SVG-based, with dimensions matching the full browser window, and the masks are defined programmatically through D3’s `call` method.

JJimMaltby
86% match
Loading thumbnail…

GiRiB&W_Ep3-Sol_LeWitt-FullRepo-pt2

This visualization reproduces a Sol LeWitt-inspired geometric composition using alternating horizontal and vertical striped rectangles, masked by two overlapping circle shapes to create a dynamic intersecting pattern. The piece uses D3.js (v6.6.1) with specific imports including `select`, `range`, `symbols`, and `symbol` to generate the SVG output. It creates a 100-stripe grid where horizontal and vertical bands are each constrained by a separate SVG mask—one with a black background and white circle, the other inverted—resulting in a crossfading intersection of line directions. The code dynamically sizes elements to the window dimensions.

JJimMaltby
86% match
Loading thumbnail…

GiRiB&W_Ep3-Sol_LeWitt-FullRepo-pt5

This visualization reproduces a Sol LeWitt art piece using overlapping horizontal and vertical stripes. A grid of thin black rectangles is layered in both orientations, each masked by one of two complementary masks that reveal different symbol shapes. The code uses D3 selections, `range`, and `symbol` to generate the masks, with `svg.append('mask')` defining white or black fill areas. Rendered as SVG in the browser, it dynamically fills the viewport and cycles through D3’s symbol types at varying positions.

JJimMaltby
85% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This generative art piece reproduces a Sol LeWitt wall drawing using pure JavaScript and the SVG API. It displays a grid of alternating horizontal and vertical stripes that intersect within central circular masks, creating a layered geometric pattern. The code constructs an SVG canvas with two circle masks—one revealing horizontal bars, the other vertical bars—overlaid to produce the final composition. No external libraries are used; all elements are created dynamically via `document.createElementNS` and styled with inline attributes.

Kktshim@snu.ac.kr
85% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

A generative rendering of a Sol LeWitt-inspired geometric composition uses SVG masks to reveal intersecting horizontal and vertical line grids. The artwork first displays 100 horizontal rects, masked by a central white circle, then overlays 100 vertical rects masked by an inverted circle, creating a cross-shaped overlap of striped bands. Built entirely with native browser APIs, the code manipulates SVG elements directly via `document.createElementNS`, setting `mask` attributes to alternate visibility across the two circular regions. No external libraries are used; the piece relies on simple `rect` elements, SVG `mask` definitions, and coordinate calculations based on `window.innerWidth` and `window.innerHeight`.

SSerge
84% match