Skip to main content
SimilarExport ZIP
100%

sol lewit reproduction

✓ Published1🌍 Public
KKerim
Last edited Aug 23, 2022
Created on Aug 22, 2022
Forked from Hello VizHub

The visualization reproduces Sol LeWitt's geometric wall drawing style using horizontal and vertical striped rectangles layered and masked into circular and diamond-shaped forms. Built with D3 v7, it uses `select`, `range`, `join`, and `symbol` to generate SVG elements dynamically, with two masks (`#mask` and `#mask-2`) controlling visibility of the overlapping bands. The artwork renders at four times the window width, with dimensions derived from `window.innerWidth` and `window.innerHeight`, producing a large-scale, pattern-based composition.

AI-generated description

introduction to d3 with many useful tips

MIT Licensed

Similar vizzes

Loading thumbnail…

sol lewit reproduction assignment

This visualization reproduces the geometric precision of Sol LeWitt’s wall drawings using D3.js, encoding alternating vertical and horizontal line grids. It renders a series of thin rectangles that are selectively masked by SVG masks containing paths of abstract symbols, creating overlapping patterns of positive and negative space. The code leverages D3’s `select`, `range`, `symbols`, and `symbol` APIs to generate the grids and symbol paths, with masks (`url(#mask0)`, etc.) toggling visibility. The result is a dynamic, screen-sized composition that mirrors LeWitt’s systematic, rule-based aesthetics through algorithmic drawing.

KKerim
93% match
Loading thumbnail…

sol_lewit_repro with D3

A generative visualization reproduces Sol LeWitt's geometric wall drawings by combining cyan horizontal stripes and magenta vertical stripes across the full viewport, with two circular masks creating a central lens effect. Built with D3.js, the code uses `range(n)` to generate 100 rectangles per orientation and `selectAll().join()` to bind data to SVG rect elements. Masking is implemented through SVG mask elements where one circle punches a hole in a dark field and the other inverts the pattern, demonstrating D3's SVG manipulation and data-driven rendering capabilities.

Ppoppy
90% match
Loading thumbnail…

Sol LeWitt Reproduction

This visualization uses raw SVG and JavaScript to reproduce a Sol LeWitt wall drawing. It layers 100 horizontal and 100 vertical rectangular stripes across the full browser window. A circular mask, created via SVG `mask` and `circle` elements, is applied only to the horizontal lines, revealing them solely within a central 200-pixel radius. The code dynamically sizes the artwork to the viewport dimensions, using `document.createElementNS` and `setAttribute` to build the composition without any external libraries.

EEdgar Cortez
90% match
Loading thumbnail…

Sol LeWitt reproduction

This piece reproduces a Sol LeWitt wall drawing using JavaScript to generate SVG elements dynamically. It displays a composition of horizontal and vertical striped rectangles that form a distinct circular pattern at the center of the viewport. The rendering uses two SVG masks, `inner-circle-mask` and `outer-circle-mask`, to control the visibility of the 100 horizontal and 100 vertical `<rect>` elements, which are sized relative to the window’s dimensions. The code relies on basic SVG APIs such as `createElementNS`, `setAttribute`, and `appendChild` to construct the artwork.

AAngela Kochoska
90% match
Loading thumbnail…

full sol_lewit_repro with D3

This work visualizes a Sol LeWitt-inspired wall drawing using cyan horizontal and magenta vertical stripes, both shaped by circular masks to create a central circular reveal. The piece renders as a full-window SVG using the D3.js library, leveraging D3's `select`, `range`, and `join` APIs to generate 100 stripe rectangles per direction. Two SVG masks define the overlapping black-and-white circle patterns that reveal the stripes within a circular aperture, with the horizontal and vertical bands intersecting at right angles.

Ppoppy
90% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using D3.js to generate a grid of horizontal and vertical striped rectangles. The rendering uses SVG masks to create two overlapping circular cutouts, with horizontal lines visible in one circle and vertical lines in the other. The code builds the visualization with D3 selections, `range`, and mask elements, sizing it to the full browser window.

LLohitB
90% match
Loading thumbnail…

Sol Lewit Reproduction Vertical

This example reproduces a Sol LeWitt-style drawing with vertical and horizontal striping. Thin vertical and horizontal rectangles are drawn across the full width and height of the viewport, each masked so only a central circular region reveals the intersecting grid pattern. The visualization uses D3 selections, data joins with `range()`, and SVG `mask` elements to layer two complementary color schemes. The code relies on D3 version 7.8.5 and renders entirely as an SVG graphic.

Aayo
89% match
Loading thumbnail…

Sol LeWitt reproduction with D3 method 2

This visualization reproduces a Sol LeWitt wall drawing using two sets of alternating horizontal and vertical striped rectangles, with circular masks applied to create a cross-like pattern at the center. The SVG rendering uses D3 v7’s `select`, `range`, and data joins to generate 100 rects in each group, while custom `mask` elements with black and white fills define the visibility of the overlapping grid.

LLouis Astorg
89% match