Skip to main content
SimilarExport ZIP
100%

Full Sol LeWitt Reproduction with D3

✓ Published1🌍 Public
Aadityapalliyil0@gmail.com
Last edited Oct 1, 2024
Created on Sep 30, 2024

This example reproduces a Sol LeWitt-style geometric composition using D3 version 7 and SVG rendering. It draws 100 horizontal and 100 vertical rectangular strips across the full viewport, each masked by a circular pattern that alternates between black and white fills. The masks are created with d3.symbol and a square symbol, transformed to the center, and applied via the `mask` attribute. The code uses `d3.select`, `d3.range`, and `join` to generate the grid.

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-style geometric composition using D3 v3 with SVG rendering. It shows a grid of horizontal and vertical rectangles overlaid with two circular masks, one inverted, creating a dynamic interplay of lines and negative space. The code uses `d3.range`, `d3.select`, and `d3.symbol` with `symbols[1]` to generate the mask paths. Horizontal and vertical bars are drawn at regular intervals, then clipped by the masks to produce the final pattern against a full-window canvas.

Ttriciascully
93% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt wall drawing using D3.js, rendering 100 horizontal and 100 vertical stripes across the full browser window. It uses SVG masks to create alternating circular cutouts: the first mask (mask-1) reveals the grid in white with a black circle, while the second (mask-2) inverts the effect. The code employs D3’s `select`, `range`, `symbol`, and `symbols` APIs to generate the geometric composition. The final output is a generative pattern where the intersection of stripes and circular voids produces the artwork’s characteristic visual rhythm.

CCurran Kelleher
93% match
Loading thumbnail…

full Sol LeWitt Reproduction with D3

This example shows a full-screen abstract geometric composition inspired by Sol LeWitt, built with D3 v7 and rendered as SVG. Two sets of overlapping horizontal and vertical striped rects create a grid, while a diamond-shaped mask and a circular mask reveal different sections of the pattern. The code uses `d3.select`, `d3.range`, `d3.symbol` with a square symbol, and `.join()` to generate the shapes. The masks are constructed with `svg.append('mask')`, combining black and white rects and paths to control visibility.

Rroyable88
93% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired generative drawing using D3 v7. It displays a grid of alternating horizontal and vertical striped rectangles, with two circular mask overlays that invert the pattern in one region to create a layered visual effect. The code uses `d3.range`, `d3.select`, and `symbol` to build the SVG shapes, applying masks via `<mask>` elements. The artwork is rendered entirely with SVG attributes, using a fixed 100-step loop for each stripe direction and a dynamic viewport-sized canvas.

Wwspwll@gmail.com
93% match
Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example reproduces Sol LeWitt’s geometric wall drawings using D3 v3 and SVG, rendering a grid of horizontal and vertical stripes overlaid with two masks. The masks, created with SVG `<mask>` elements, cut out shapes from the stripes using D3 symbols such as circles, diamonds, and triangles. One mask inverts its fill to alternate visible and hidden symbol areas. The code leverages `d3.select`, `d3.range`, `d3.symbol`, and `d3.symbols` to generate the pattern dynamically at full window size.

SSami Friedrich
93% 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
93% match
Loading thumbnail…

Full Sol LeWitt Reproduction With D3

This example reproduces a Sol LeWitt-style drawing using D3.js, rendering a full-screen SVG composed of 100 horizontal and 100 vertical stripes that are masked by two overlapping circular forms. The code directly uses `d3.select`, `d3.range`, and the `join` API to append and position the rectangles, while `d3.symbol` and `d3.symbols` generate the circular mask paths. The two masks, one inverted, are applied via the `mask` attribute to create a subtle interplay between the grid and the geometric shapes. The visualization responds to the browser window’s dimensions, as the width and height are taken from `window.innerWidth` and `window.innerHeight`.

Wwgloss
93% match
Loading thumbnail…

Full Sol LeWitt Reproduction D3

This example reproduces a Sol LeWitt wall drawing using D3 to render a dense grid of horizontal and vertical stripes as SVG rectangles. Two SVG masks, each containing a large circular symbol from `d3.symbol`, cut the stripes to create a bold interlocking pattern across the full browser window. The code relies on D3 selections, `range` for generating stripe positions, and the `symbol` API, with the visualization sized to the viewport dimensions.

Ttverdone
92% match