Skip to main content
SimilarExport ZIP
100%

Fork of GiRiB&W_Ep4-Sol_LeWitt-FullRepo Ex V2

✓ Published0🌍 Public
PPablo Machado
Last edited May 6, 2024
Created on May 6, 2024

This visualization reproduces a Sol LeWitt-style geometric composition using a grid of horizontal and vertical black-and-white stripes. The piece creates a rhythmic, Op-Art-like pattern by layering rectangular bands with alternating masks that selectively reveal or hide sections of the underlying stripes. Built with D3.js (v6), the code uses `range`, `select`, and `symbol` APIs to generate the shapes. The SVG rendering applies custom `mask` elements, each containing rects and D3 symbols (circles, crosses, diamonds), whose white or black fills determine which parts of the stripe layer become visible.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of GiRiB&W_Ep4-Sol_LeWitt-FullRepo Ex V2

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.

Kkathrynrbernard
92% 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
90% 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
90% match
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
89% 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
89% 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
89% 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_Ep3-Sol_LeWitt-FullRepo-Exercise_1

This visualization reproduces a Sol LeWitt-inspired geometric composition using D3.js. It displays ten horizontal black rectangles stacked vertically across the left half of the SVG canvas, with each rectangle’s vertical position mapped through a linear scale from the data range to half the window height. The code uses `d3.range` and `d3.scaleLinear` to generate and position the shapes, applying an SVG mask that is defined but not fully rendered in the provided source. The artwork is generated programmatically in an SVG format, directly responding to the browser window dimensions.

JJimMaltby
86% match