Skip to main content
SimilarExport ZIP
100%

sol-D3

✓ Published0🌍 Public
Rrehoy
Last edited Oct 30, 2023
Created on Oct 30, 2023

This example reproduces a Sol LeWitt art piece using D3.js. It generates two sets of horizontal and vertical striped rectangles, each masked by distinct patterns of alternating black and white bands and geometric symbols. The masks are created with D3’s `scaleBand` for positioning, `symbol` and `symbols` for paths, and `select`/`join` for DOM updates. The render uses SVG, with dimensions derived from the browser window size.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using modular D3 APIs. It displays intersecting horizontal and vertical striped bands that alternate between solid and patterned regions, with the pattern shapes (symbols) varying across the width. The visualization uses D3 selections, `scaleBand` for positioning, and SVG masks to create the alternating effects. It builds the composition by appending `<rect>` elements and D3 `symbol` paths inside two masks, with the entire piece rendered as SVG in the browser viewport.

BbeyzaD
91% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3.js

This example reproduces a Sol LeWitt art piece using D3.js and SVG. It generates a grid of horizontal and vertical rectangles, then applies two masks that shape the visible pattern. The masks are created with D3’s `symbol` and `symbols` APIs, placing geometric symbols in alternating black-and-white fills to selectively hide or reveal parts of the grid. The code uses `select`, `range`, and `.join()` to efficiently render the elements, with the rendering confined to the full browser viewport.

MMarcus Vinicius da Silveira Richa
91% match
Loading thumbnail…

Full Sol Lewitt Reproduction with D3-2

This example reproduces a Sol LeWitt art piece using D3 version 6.6.1 with SVG rendering. It displays a grid of horizontal and vertical striped rectangles, overlaid with two masks that reveal or hide the stripes using D3’s `symbol` shapes. The code uses `select`, `range`, `symbols`, and `symbol` to generate mask patterns, and applies them via `attr('mask', ...)` to create the visual effect.

Yyejichun@naver.com
91% match
Loading thumbnail…

Full Sol LeWitt Piece Reproduction with D3

This example reproduces a Sol LeWitt wall drawing using D3.js to generate SVG shapes. It layers horizontal and vertical striped rectangles, each filtered by a separate mask. The masks are built from alternating black and white bands containing geometric symbols, such as arcs and lines, drawn with the `symbol` and `symbols` APIs. By inverting the mask colors, the piece creates intersecting patterns across the full browser window, with the rendering using D3’s `select`, `range`, and `join` methods for efficient SVG construction.

MMika Kutila
90% match
Loading thumbnail…

Sol LeWitt Symbols with D3

A reproduction of a Sol LeWitt art piece renders horizontal and vertical striped rectangles on an SVG canvas. D3 selections and the `range` generator create the strips, while SVG `mask` elements with a white circle reveal the intersection pattern. The code uses the `select`, `append`, and `join` APIs from D3 v7 to build the visualization, which responds to the full browser window size.

Ssuzzymeetstranger@gmail.com
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3.js, generating a grid of thin horizontal and vertical rectangles that overlap across the full browser window. The composition uses SVG masks to create alternating visibility: one mask reveals a central diamond shape against a black background, while the other inverts the pattern with a white background. The code leverages D3’s `select`, `range`, and `join` to append rectangles, and `symbol` with `symbols` to define the diamond mask paths. Rendering is SVG-based, with masks applied via the `mask` element.

Jjajinkya
90% match
Loading thumbnail…

Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3 v6. It displays a grid of vertical and horizontal striped rectangles overlaid with two circular masks, creating intersecting line patterns. The visualization uses `d3.select`, `d3.range`, and the `join` pattern to generate 100 SVG rectangle elements in each direction. Two SVG masks, each containing a black or white circle, selectively reveal or hide portions of the stripes, producing the geometric contrast characteristic of LeWitt’s work. The SVG fills the entire browser window.

AAndre J Denais
90% match
Loading thumbnail…

D3 Sol LeWitt Reproduction RSJ

This visually striking example reproduces a Sol LeWitt art piece using D3 v7 and SVG, generating a dynamic geometric pattern of alternating colored rectangles and symbols across the full window width. The code creates two complementary masks that filter the rectangle layers, using D3’s `scaleBand`, `range`, `symbol`, and `symbols` to position and render varied shapes. Each mask inverts its fill pattern, producing a mirrored, interlocking composition. The artwork is driven by programmatic generation rather than external data, with dimensions tied to the viewport and a fixed 120-column grid, emphasizing algorithmic design.

RRifat Shadman
90% match