Sol LeWitt Reproduction

100%

Sol LeWitt Reproduction

✓ Published1🌍 Public

Last edited Jul 4, 2023

Created on Jul 3, 2023

This visualization reproduces a Sol LeWitt-inspired geometric composition using overlapping vertical and horizontal stripes, each masked by repeating symbol shapes. Two SVG masks alternate between black and white backgrounds with contrasting symbol cutouts, creating intersecting patterns of circles, crosses, and diamonds across the full viewport. The code uses D3 selections with `join` for data-driven rectangle generation, plus D3’s `symbol` and `symbols` to render mask shapes. Rendering occurs via SVG elements dynamically sized to `window.innerWidth` and `window.innerHeight`.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Full Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using D3 to generate SVG shapes. Alternating vertical and horizontal striped rectangles are layered beneath two masks, creating a geometric composition where the pattern changes across the canvas. Each mask contains alternating black and white regions with D3 symbol paths—including circles, crosses, and diamonds—positioned at intervals. The code uses `d3.select`, `d3.range`, `d3.symbol`, and `d3.symbols` to build the visualization, with the masks inverted relative to each other for a contrasting effect.

MMatthew Bruffey

92% match

Loading thumbnail…

Sol LeWitt Reproduction with D3 Exercise

This visualization reproduces a Sol LeWITT-style geometric composition using overlapping horizontal and vertical line grids. Four mask layers alternate line orientations and symbol shapes—including circles, diamonds, crosses, and triangles—to create a rhythmic interplay of foreground and background elements. The code uses D3 selections, `range`, `symbol`, and `symbols` APIs to generate SVG rectangles and paths, with masks defined via `renderMask` to invert or combine patterns across the full viewport.

Kkathrynrbernard

91% match

Loading thumbnail…

Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition using overlapping horizontal and vertical bands that are partially revealed by SVG masks. The D3 code generates 100 rectangular strips in each direction and applies two distinct masks—one inverted, one not—that use D3’s `symbol` shapes to create cutout effects. The visualization relies on `d3.select`, `d3.range`, and SVG mask elements within a React-free, plain HTML setup. The final pattern emerges from the interplay of line density and symbolic transparency across the full viewport.

MMark Christian

91% match

Loading thumbnail…

Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt-style geometric artwork using overlapping horizontal and vertical striped rectangles, with a circular mask creating a central focal point. The horizontal bands rotate continuously via a CSS keyframe animation applied to the SVG elements. Built with D3.js, the code uses `select` and `range` to generate 100 rectangles in each direction, while two SVG masks (`circle-mask` and `circle-mask-2`) alternately reveal and hide the stripes, producing an inverted circular pattern at the center.

GGayan Priyadarshana

90% match

Loading thumbnail…

Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt-style geometric composition using D3.js and SVG. It displays a grid of vertical and horizontal rectangles overlaid with two masks that reveal alternating symbol shapes—including circles, crosses, and diamonds—arranged horizontally across the canvas. The code imports `select`, `range`, `symbols`, and `symbol` from D3 to generate the shapes and masks, rendering 100 rectangles per axis at 20-pixel intervals. The visualization uses the D3 `range` and `join` methods to bind data, with mask rectangles toggling between white and black fills to create the interlocking pattern.

Aabhineetsingh10

90% match

Loading thumbnail…

Sol LeWitt Reproduction more shapes with D3

This visualization reproduces a Sol LeWitt-style geometric composition using overlapping striped rectangles and mask-based shapes. A grid of horizontal and vertical bars is drawn with D3’s `select` and `range` methods, while two SVG masks create contrasting circular cutouts—one inverted—by combining black and white fills with a `symbol` path from the `symbols` array. The masks alternate the visibility of the stripes, producing an optical interaction of positive and negative space. The piece uses fixed window dimensions and renders entirely with SVG, mirroring the minimal aesthetic of the original artwork.

YYingkai Song

90% match

Loading thumbnail…

Sol LeWitt Reproduction with D3 - Shapes

This example reproduces a Sol LeWitt-inspired geometric composition using D3.js version 7, rendered as SVG in a React-free HTML page. It displays 100 horizontal and vertical barcode-like stripes that intersect with a row of alternating filled and unfilled symbol shapes (circles, crosses, diamonds, and others) generated via `d3.symbol` and `d3.symbols`. Two SVG masks (`mask-1` and `mask-2`) use inverted fill colors to selectively reveal or hide the stripes, creating a dynamic interlocking pattern across the full viewport width and height.

Aa0x0

90% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces the geometric style of Sol LeWitt using overlapping horizontal and vertical stripes. A central circular mask reveals the intersection pattern where the two sets of rectangles meet, creating a woven visual effect. The visualization is built with raw SVG elements, including two distinct `<mask>` definitions, and is rendered dynamically in a browser using JavaScript. The code programmatically generates all rectangles in loops, with the masks controlling visibility to achieve the final composition without external libraries.

Ccardoza-IPH

90% match