Fork of Full Sol Lewitt whit D3 reduce code

100%

Fork of Full Sol Lewitt whit D3 reduce code

✓ Published0🌍 Public

Last edited Jun 8, 2023

Created on Jun 8, 2023

This visualization reproduces a Sol LeWitt wall drawing as a grid of horizontal and vertical bars, intersected by a central circular symbol. It uses the D3 library (v7.8.5) to generate SVG masks that reveal or hide alternating bar orientations. The code defines two masks, one for each direction, applying a path built from D3’s `symbol` API to create the geometric cutout. The artwork is generated procedurally with `range`, `select`, and `append` calls, rendering abstract geometric forms without external data.

AI-generated description

A reproduction of Sol LeWitt art pieceSol Witt art piece. Using library D3.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Full Sol LeWitt Reproduction with D3

This visualization recreates a Sol LeWitt wall drawing using an SVG canvas. It layers two sets of perpendicular, striped rectangles, each masked to reveal the artwork through repeating geometric symbols. The code uses D3 v7 methods like `select`, `range`, `join`, and `symbol` to generate the marks. Two SVG masks are applied with inverted fills, producing a crosshatched pattern where the symbols appear as cutouts.

Lliu yang

91% match

Loading thumbnail…

Fork of Full Sol LeWitt Reproduction with D3

A tiled grid of horizontal and vertical bars forms a minimalist composition, overlaid with two masks that reveal and hide sections using d3 symbols as cutouts. The visualization uses D3 v6 with select, range, symbols, and symbol to generate SVG shapes, while mask elements with rect backgrounds and symbol paths create the interlocking positive and negative spaces. The code builds two masked layers to produce a Sol LeWitt-inspired geometric interplay, rendered at full screen with no interaction.

Ttriciascully

91% 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

90% match

Loading thumbnail…

Fork of Fork of Full Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt wall drawing using D3.js, rendering a grid of horizontal and vertical lines as SVG rectangles. Two masks overlay the composition, with one inverted, creating a contrasting pattern where the line grid is partially revealed or hidden. The code builds 100 spaced rectangles in each direction, then applies masks generated from D3’s `symbol` paths, which are transformed and positioned across the canvas. The rendering uses D3’s selection and join APIs to construct the SVG dynamically, with dimensions matching the browser window.

Zzhuomo-maker

89% 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

89% match

Loading thumbnail…

Fork of Full Sol Lewitt Reproduction with D3

This visualization creates a grid of horizontal and vertical bars across the full browser window, using SVG masks to reveal d3 symbols (shapes) from the d3-shape module. It uses the `select`, `range`, `symbols`, and `symbol` functions from D3 v6 to generate a striped pattern with four distinct symbol types as mask cutouts. The code renders 100 rectangles in each orientation, with two masks applied to alternate between light and dark shading on the revealed shapes. The rendering adapts to the window’s dimensions and uses `join` to bind data to SVG elements.

Mmaximus2581

89% match

Loading thumbnail…

Fork of Fork of full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3 v7 with SVG rendering, layering horizontal and vertical striped rectangles over masked symbol shapes. The code generates 50 horizontal and vertical bars positioned incrementally, then applies two masks—one containing a row of D3 symbols (circles, crosses, diamonds, etc.) and another with a large central triangle. The masks alternate inverted fills, creating intersecting cutout effects where the stripes show through the symbol shapes. The visualization updates dynamically to the browser window dimensions, demonstrating D3’s `range`, `symbol`, and `join` methods for procedural art.

Rroyable88

89% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization recreates a Sol LeWitt-inspired geometric composition using two overlapping grids of vertical and horizontal bars. The bars are partially revealed through circular masks, creating a cross-shaped aperture effect at the center of the canvas. The code uses D3 v7’s `select`, `range`, and `join` methods to generate SVG rectangles, with two `mask` elements defining the visible circular regions. The artwork spans the full browser window and renders entirely as SVG, with all positioning computed dynamically from `window.innerWidth` and `window.innerHeight`.

Lliu yang

89% match