Skip to main content
SimilarExport ZIP
100%

Sol Le Witt Reproduction Original

✓ Published1🌍 Public
AAmauri Ribeiro
Last edited Oct 25, 2024
Created on Oct 25, 2024

This example reproduces a Sol LeWitt-inspired drawing using an SVG bar chart approximation. It shows a grid of thin, evenly spaced horizontal and vertical bars that intersect within a central circular region, creating a woven geometric pattern against a plain background. The visualization uses two SVG masks (`circle-mask` and `circle-mask-2`) to clip alternating sets of 100 rectangles—horizontal bars masked by a white circle, and vertical bars masked by a black circle—so only the overlapping area reveals the full crosshatch effect. The bars are generated procedurally via raw DOM manipulation with `createElementNS` and positioned based on the window dimensions.

AI-generated description

An approximation of bar chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

Full Sol Le Witt Reproduction with D3

This example reproduces a Sol LeWitt-inspired drawing using D3 and SVG masks. It displays a grid of horizontal and vertical bars, with a central circular region where the two sets of bars visually intersect and invert their colors. The code uses D3 selections with `range` and `join` to generate 100 rectangles in each orientation, and defines two SVG masks with `circle` elements to control which bars are visible. The final image resembles a minimalist bar chart filtered through a circular aperture.

AAmauri Ribeiro
90% match
Loading thumbnail…

Sol LeWitt Reproduction Horizontal

This example reproduces a Sol LeWitt-style geometric drawing, showing a grid of black horizontal and vertical bars that intersect within a central circular area. The rendering uses JavaScript to construct an SVG scene directly, employing two SVG masks (`circle-mask` and `circle-mask-2`) to clip the alternating bar orientations. The first mask reveals horizontal stripes inside a 200-pixel-radius circle, while the second mask reveals vertical stripes in the surrounding area, creating a continuous pattern that swaps orientation at the circle’s boundary. All shapes are generated procedurally via the Document API, with no external data source.

Wwspwll@gmail.com
89% match
Loading thumbnail…

Sol Lewitt Reproduction vertical

This example reproduces a Sol LeWitt-inspired drawing using SVG, rendering 100 horizontal bars masked by a central circle. The code builds the visualization dynamically with the `document.createElementNS` API, creating a white rectangle and black circle to define the mask, then looping through the bars. Each bar is 10 pixels tall, spaced 20 pixels apart, and clipped by the `url(#circle-mask)` reference. The visualization fills the entire browser window, with the mask and bars sized based on `window.innerWidth` and `window.innerHeight`, producing a geometric composition of stripe-like shapes.

HHéloïse Feldmann
89% match
Loading thumbnail…

Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-style drawing using raw SVG elements created via the `document.createElementNS` API. It shows a grid of thin horizontal and vertical rectangles that are revealed only within two circular regions at the center of the screen, achieved through SVG masks. The first mask uses a white circle on a black background to show the horizontal bars, while the second mask inverts the colors to display the vertical bars. The layout adapts to the window size, and the 100 bars in each direction are generated procedurally with no external data source.

Aadityapalliyil0@gmail.com
89% match
Loading thumbnail…

Sol LeWitt SVG

This example reproduces a Sol LeWitt-style drawing using D3.js and SVG, displaying a grid of horizontal and vertical striped bars that are partially revealed through circular masks. Two mask layers alternate between clipping the horizontal and vertical rectangles, creating a layered composition where the bars intersect and disappear within the central circle. The code uses D3’s `select`, `range`, and data joins (`join('rect')`) to generate 100 rectangles in each direction, with masks defined via SVG `<mask>` elements and applied through `attr('mask', 'url(#circle-mask)')`. The visualization renders full-window, with dimensions derived from `window.innerWidth` and `window.innerHeight`.

VValentine Solonechnyi
87% match
Loading thumbnail…

Sol LeWitt Reproduction

This piece reproduces a Sol LeWitt wall drawing using SVG. It displays a grid of horizontal and vertical bars, but only within two circular regions at the center of the canvas. Outside these circles, the rectangular elements are hidden. The code creates two SVG masks to control the visibility: the first mask reveals a white circle over a black background for the horizontal bars, while the second mask uses a black circle on white to show the vertical bars. All elements are generated procedurally through the SVG API in a single HTML file.

Xxyzcorrupt@gmail.com
87% match
Loading thumbnail…

Sol LeWitt Repro Vertical

This example reproduces a Sol LeWitt drawing using the SVG API. It displays a grid of horizontal and vertical black bars on a white background, creating an intersecting pattern. A circular mask reveals only the horizontal lines within its radius, while a second, inverted mask reveals only the vertical lines outside that same circle. The code constructs the masks and bars dynamically with `createElementNS` and `setAttribute`, using the document’s width and height for full-screen coverage.

SSam Hege
87% match
Loading thumbnail…

Sol LeWitt Reproduction AG

This example reproduces a Sol LeWitt wall drawing using SVG masks and layered rectangles. The code creates two circular masks, one with a black background and white circle, the other inverted, then applies them to 100 horizontal and 100 vertical bars. The result is a grid of intersecting lines visible only within the circular regions, mimicking the geometric precision of LeWitt’s conceptual art. It uses raw SVG DOM manipulation via `document.createElementNS` and mask attributes, with no external libraries.

Gguththered
87% match