Fork of Sol LeWitt art reproduction - attempt 2 (JavaScript basics)

100%

Fork of Sol LeWitt art reproduction - attempt 2 (JavaScript basics)

✓ Published0🌍 Public

Last edited Jan 29, 2023

Created on Jan 29, 2023

Forked from Sol LeWitt art reproduction - attempt 2

This example reproduces a Sol LeWitt art piece using an SVG canvas with a 960x500 viewBox. The code contains commented-out JavaScript tutorials covering basic programming concepts like variables, loops, functions, and object literals. The active script is nearly empty, leaving only the empty SVG element visible on screen, with no additional data or rendering logic implemented yet. The piece relies on the standard SVG API for structure, while the JavaScript groundwork anticipates future geometric drawing commands for the conceptual art reproduction.

AI-generated description

A reproduction of a Sol LeWitt art piece

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece by rendering a single vertical black rectangle against a blank canvas, echoing the minimalist geometric style of the original work. The code creates an SVG element sized to the full browser window and appends a rectangle positioned 100 pixels from the left, with a width of 10 pixels and a height matching the viewport. It uses the raw DOM APIs `createElementNS` and `appendChild` to build the SVG structure without any external libraries. The piece highlights the simplicity of SVG-based drawing, focusing on the interaction between the fixed shape and the responsive window dimensions.

JJulio Costa

85% match

Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt drawing using only raw SVG and JavaScript, with no external libraries. It displays a grid of alternating horizontal and vertical lines that remain visible only within two intersecting circular masks, creating a dynamic visual interplay between the line directions. The code builds the SVG dynamically by appending a set of horizontal rectangles masked by a black/white circle, and vertical rectangles masked by an inverse circle, both centered on the screen. The rendering relies on native SVG mask elements and DOM manipulation in plain JavaScript.

MMaras13

85% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG and JavaScript. It shows a grid of overlapping horizontal and vertical bands, where a circular area in the center is masked to reveal only the vertical lines, while the outer region displays only the horizontal ones. The code builds the SVG via `document.createElementNS`, creates two SVG `<mask>` elements with circle and rect primitives to control visibility, and renders 100 rectangles per axis. No external libraries are used; the rendering entirely relies on native browser SVG APIs.

PPurshotam Bohra

85% match

Loading thumbnail…

Fork of SVG Fundamentals - Sol LeWitt repro follow-along

This example reproduces a Sol LeWitt art piece using dynamically generated SVG rectangles. The code creates 100 vertical black bars, each 10 pixels wide, evenly spaced across the full window height, filling the browser viewport. It uses the Document API (`createElementNS`) to build SVG elements from scratch within JavaScript rather than a dedicated visualization library. The rendering approach directly mirrors LeWitt’s geometric, minimalist style by iterating through a fixed count of shapes.

MMichael Gomersall

85% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG and JavaScript, showing a grid of vertical lines confined to a circular region at the center of the screen. The code creates an SVG mask with a white rectangle and black circle, then applies that mask to a series of thin vertical rectangles spaced every 20 pixels across the viewport. The result is a minimalist geometric composition where the line grid is visible only inside the circular window, mimicking LeWitt’s systematic drawing style.

Mmegan-grannan

85% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using only JavaScript and the SVG API. A central circular mask reveals a grid of horizontal black lines in the center of the viewport, while a second inverted mask allows vertical black lines to appear only outside the same circle, creating a striking contrast. The code dynamically creates all SVG elements—including masks, rectangles, and circles—based on the browser window dimensions, generating 100 horizontal and 100 vertical stripes that intersect in a pattern defined by the two masks.

Mmagswo

84% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece as a static SVG canvas. It shows a black-and-white geometric composition based on the artist’s instructional wall drawings, rendered with abstract lines and shapes. The code sets up an SVG element with fixed dimensions and uses a JavaScript script that logs basic console output, but it does not yet contain any drawing instructions or data-visualization logic. The rendering approach is plain SVG, with the structure prepared for future generative or instructional drawing code.

Zzerzenka

84% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This is a generative art piece that reproduces a Sol LeWitt wall drawing using JavaScript and the Document Object Model (DOM) to create SVG elements. It shows a grid of horizontal and vertical lines, with a central circular region where the line pattern is inverted. The code uses a combination of SVG masks with white and black circles to control which sets of lines are visible in the center versus the rest of the canvas. The lines are drawn as rectangular strips, with spacing and stroke width derived from the browser window's dimensions.

SSalahAnwer-dev

84% match