LeWitt Vertical

100%

LeWitt Vertical

✓ Published1🌍 Public

Last edited Sep 23, 2022

Created on Sep 23, 2022

This example creates a generative, grid-based composition inspired by Sol LeWitt’s wall drawings. It renders a series of black vertical bars evenly spaced across the full width and height of the browser window. The visualization is built entirely with raw SVG elements created via the Document Object Model API, using `document.createElementNS` and `setAttribute` to add rectangle shapes directly to an SVG container. No external libraries are used, and the bar width and spacing are calculated dynamically from the viewport dimensions. The result is a simple, minimalist pattern that fills the screen.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

LeWitt

This example generates a minimalist geometric composition inspired by Sol LeWitt, using raw JavaScript and the SVG DOM API. It creates a grid of vertical and horizontal bars by appending `rect` elements to an SVG canvas that fills the entire browser window. The vertical bars are positioned on the left half, while horizontal bars extend from the center to the right, with spacing based on a fixed bar width and the window dimensions. No external libraries are used; the code relies on `document.createElementNS` and manual attribute setting.

Ttomasnihlen

93% match

Loading thumbnail…

LeWitt D3

This example creates a full-screen generative drawing inspired by Sol LeWitt’s minimalist wall drawings, using raw SVG rectangles rather than the D3 library (which is listed as a dependency but unused in the code). It calculates the number of bars based on the browser window’s width and height, rendering evenly spaced vertical black bars that alternate with gaps of equal size. The rendering approach directly manipulates the SVG namespace via `document.createElementNS`, setting each rectangle’s position and dimensions dynamically to fill the viewport. The result is a simple, procedural grid pattern that responds to the window size.

Ttomasnihlen

91% match

Loading thumbnail…

LeWitt Horisontal

This example generates a full-screen composition of horizontal bars, using D3.js to create SVG rectangles that tile the viewport. The visualization relies on D3’s `select` and `append` API to build the SVG structure dynamically. The pattern resembles Sol LeWitt’s wall drawings, with a straightforward, systematic placement of bars. The code includes commented-out mask and circle elements, though these are not active in the final render. The result is a clean, generative graphic that adapts to the browser window size.

Ttomasnihlen

91% match

Loading thumbnail…

SOl LeWitt (TB)

This example presents a minimalist generative composition inspired by Sol LeWitt’s geometric wall drawings. It displays 100 vertical rectangular bars, each 10 pixels wide, evenly spaced 20 pixels apart across the full browser window. The code constructs the artwork using raw SVG elements created via the `document.createElementNS` API, appending them to an SVG container sized to `window.innerWidth` and `window.innerHeight`. The algorithm iterates with a simple loop, setting each rectangle’s `x` position incrementally, resulting in a rhythmical grid pattern without any interactivity or data input.

TTrevor Brown

87% match

Loading thumbnail…

Sol Lewitt Repro

This generative visualization reproduces a Sol LeWitt wall drawing as a series of thin, full-height vertical bars. The piece fills the browser window with 100 equally spaced black rectangles, creating a minimalist, rhythmic pattern. The code dynamically sizes the SVG to the viewport’s inner width and height, and generates each bar using the native DOM API `document.createElementNS` within an SVG namespace. It relies on procedural repetition rather than external data, directly scripting each rectangle’s position and dimensions in a loop.

GGullyPlook

85% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired wall drawing using dynamically generated SVG rectangles. It renders 100 vertical bars of fixed width, spaced evenly across the full viewport height, creating a minimalist grid pattern that fills the browser window. The visualization works by creating an SVG element with the DOM API `document.createElementNS`, setting its dimensions to match the window, and appending each rectangle with explicit `x`, `width`, and `height` attributes. No external libraries are used; it relies entirely on native JavaScript and SVG shape creation.

WWasanta Pruttisarikorn

85% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-style geometric composition using a grid of vertical SVG rectangles. The code generates 100 thin, evenly spaced bars that span the full height of the browser window, creating a rhythmic, minimal pattern. It builds the SVG dynamically with the Document Object Model (DOM) API, using methods like `createElementNS` and `setAttribute` to construct and style each rectangle. The visualization responds to the current viewport dimensions, filling the entire screen with its structured, monochrome array.

Aandu006@gmail.com

85% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired geometric composition using raw SVG and JavaScript. It shows a systematic grid of thin, evenly spaced vertical bars that span the full height of the viewport, creating a rhythmic, minimalist pattern reminiscent of LeWitt’s wall drawings. The code creates an SVG container sized to the browser window and appends 100 rectangles, each positioned at increasing x-coordinates with a fixed width, using the `document.createElementNS` API for SVG elements. The rendering relies solely on native DOM manipulation and CSS styling via an embedded stylesheet, with no external libraries beyond a Google Font import for the text styling.

Mmaciekawsq@gmail.com

84% match