Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
AAdeelah Mir
Last edited Jan 30, 2023
Created on Jan 30, 2023

This example reproduces a Sol LeWitt-inspired geometric composition using D3. It displays a series of 100 horizontal bars overlaid with a circular mask that reveals only the central area of the pattern. Built with the D3 `select` and `range` APIs, the code constructs SVG elements via raw `document.createElementNS` calls and applies a mask to hide bars outside the circle. The design uses black rectangles on a white background, with the circle placed at the center of the viewport.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt art piece using D3, generating a series of horizontal bars that are clipped by a circular mask. The visualization fills the entire browser window with alternating offset rectangles, creating a geometric pattern. The code uses D3's `select` and `range` functions to build SVG elements, though the mask and circle logic is present but commented out. The rendered output shows a grid of colored bands restricted to a central circular area.

Bbtlhgboy@icloud.com
95% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-inspired geometric composition using D3.js. The visualization displays a grid of horizontal and vertical striped bars, which are masked to create two overlapping circular windows that reveal different parts of the pattern. The code builds an SVG canvas sized to the browser window, generates 100 horizontal and vertical rectangles each, and applies two distinct SVG masks with opposing black-and-white circular cutouts to produce the final layered effect. The rendering uses D3's `select`, `range`, and fluent `.join().attr()` chain for efficient element creation.

Llennardightcore@gmail.com
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction Final with D3

This example reproduces a Sol LeWitt-inspired geometric artwork using D3.js and SVG rendering. It displays a grid of horizontal and vertical black bars that are partially revealed through two circular mask effects, creating intersecting line patterns across the full viewport. The visualization uses d3.select and data joins to generate 100 rectangle elements for each orientation, while SVG mask elements with circle shapes control which portions of the lines remain visible. The bars are positioned mathematically based on array indices, with the masks centered in the window to produce the layered optical effect.

Kkwambokar
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt-inspired drawing using D3 and SVG. It shows a grid of horizontal and vertical bars that are partially hidden by two circular masks, creating a pattern of lines that fade in and out of view. The code uses D3’s `select`, `append`, `range`, and `.join()` API to generate the bars and masks, with the masks defined as SVG elements containing rectangles and circles. The visualization is rendered entirely with vector graphics, using a full-window canvas and a data-driven approach to build the repeating line structure.

Eedw.ext@gmail.com
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction D3

This visualization reproduces Sol LeWitt’s geometric art by rendering 100 horizontal bars of varying heights, arranged to form an abstract pattern. The bars are drawn as SVG rectangles, each with a fixed width and height, positioned vertically based on an index from `d3.range`. A circular `mask` clips the rectangles, creating a rounded composition. The code uses D3 v7’s `select` and `range` to bind data and join elements, with a minimal black-on-white aesthetic. The rendering is static, driven purely by the data values from the range, without interaction or animation.

DDyor69
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt wall drawing using D3.js to generate a dense grid of horizontal and vertical bars, creating an optical pattern of intersecting lines. The bars are rendered as SVG rectangles, with each set of bars repeated across the canvas at regular intervals. Two SVG masks with circular cutouts are applied to the bar groups, revealing and concealing portions of each direction to form a layered, lens-like visual effect. The code uses D3’s `select`, `range`, and `join` API to efficiently build and position the rectangles, and the Canvas API sets the drawing size to the full browser window.

AAaron
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt-style geometric composition, showing a grid of horizontal and vertical bars that intersect within a central circular boundary. The piece uses D3 v7 APIs including `select`, `range`, and `join` to generate 100 thin rectangles in each direction, sized to the full viewport. SVG masks (`circle-mask` and `rectangle-mask`) selectively reveal the horizontal lines within a 200-pixel-radius circle, while the vertical lines are inverted so only the outer area appears. The result highlights the interplay between line density and circular cropping, rendered entirely as static SVG elements.

MMofizur Rahman
93% match
Loading thumbnail…

Fork of Sol LeWitt reproduction with D3

This example reproduces a Sol LeWitt art piece using D3 to generate a grid of horizontal and vertical rectangles. The rectangles are masked by circles, creating an interlocking pattern where the horizontal bars show through a white circle and the vertical bars show through a black circle on a contrasting background. The code uses D3 selections and the `range` function to create 100 rectangles in each direction, applying SVG mask elements with rectangle and circle shapes. The visualization renders entirely in SVG, filling the browser window with the geometric composition.

DDilara Bozkurt
93% match