Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
Kkhalil-ryu
Last edited Oct 31, 2022
Created on Oct 31, 2022

This piece uses SVG to display horizontal and vertical lines in a grid across the entire screen, generating a striped texture rather than a literal reproduction of the Sol LeWitt artwork. Each line segment is drawn as a thin rectangle, with 100 rows and 100 columns created via d3’s range and join methods. Two circular masks are applied to the grid: one with a central white hole on a black background, and another with an inverted pattern, producing a lensing or spotlight effect. The piece pairs D3’s SVG API with custom mask elements to create a geometric, interactive-looking visual.

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 piece reproduces a Sol LeWitt wall drawing using D3.js to create a grid of horizontal and vertical lines. A circular mask reveals the intersection of the two line sets, with a white circle in the first mask and an inverted circle in the second, producing a clear central focus. The SVG rendering is generated procedurally using `d3.select`, `d3.range`, and the `join` API to append 100 rectangles in each direction, sized relative to the window dimensions. The artwork dynamically adapts to the viewport, with the mask radius fixed at 200 pixels.

SShashi Kumar
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3.js, displaying a grid of alternating horizontal and vertical striped lines across the full browser window. Two SVG masks reveal the grid through circular and geometric shapes, while the second mask incorporates D3 symbol shapes and checkerboard patterns within its design. The code uses D3 v7 APIs including `select`, `range`, `symbol`, and `symbols` to generate the SVG elements, with mask composition controling which portions of the line grid remain visible.

AAngie Va. Moreno
93% match
Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction Final with D3

This visualization reproduces a Sol LeWitt art piece using D3 to generate a grid of horizontal and vertical black lines layered over the full viewport. The lines are clipped by two circular masks centered on the screen, creating a crosshatched pattern that fades into blank space beyond the circle boundaries. The code uses D3 selections and the `join` pattern to append SVG `rect` elements, with `mask` elements defining the visible regions via white and black circles. The artwork is rendered entirely in SVG using D3 v7.

Kkwambokar
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3.js, rendering 100 horizontal and 100 vertical striped rectangles in an SVG canvas. The artwork uses two circular mask patterns—one with a black background and white circle, another with inverted colors—to create intersecting circular cutouts where the lines cross. The code uses D3's `select`, `range`, and `join` APIs to efficiently generate and position the rect elements, with the masks applied via SVG `mask` attributes to achieve the geometric composition.

Jjctmercado
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3 to generate a grid-like pattern of horizontal and vertical lines. The lines are rendered as SVG rectangles, with two circular masks applied to create a central circular viewing window. The horizontal bars are masked by a black rect with a white circle, while the vertical bars use an inverse mask, producing a crosshatched effect within the circle. The code uses d3-selection’s `select`, `append`, and `join` methods alongside `range` to efficiently create the marks.

Iibrarmunircoder
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction + D3

A fork of a Sol LeWitt reproduction uses D3 to generate layered horizontal and vertical striped rectangles across the full viewport. Two SVG masks create geometric cutouts: a white diamond-shaped hole in one mask and a black circular hole in another, revealing intersecting grid patterns. The code employs d3.select, d3.range, d3.symbols, and d3.symbol to draw paths and shapes, with masking applied via SVG mask elements. The example renders entirely in SVG, driven by window dimensions.

Iionakeeley
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece using D3 v6, displaying a grid of overlapping horizontal and vertical stripes that form a circular pattern through SVG masks. The code uses `d3.select`, `d3.range`, and `join` operations to render 100 rect elements in each direction, with the stripes visible only through two circular mask regions. The first mask reveals alternating bands inside a white circle, while the second creates an inverse effect, producing a geometric interplay of lines. The rendering approach combines D3's data-join with native SVG mask and circle elements to achieve the Op-art style composition.

CCurran Kelleher
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt art piece by layering two alternating sets of mask-applied stripes on an SVG canvas. Horizontally and vertically oriented rectangles are drawn using D3’s `select`, `append`, and `join` APIs, with each set filtered through a circular mask to reveal the intersecting bands within a central circle. The second mask inverts the first, creating a positive/negative interplay of the grid. The code relies on D3 for DOM manipulation and uses window dimensions to scale the piece to the full browser viewport.

Ccdholmes11
92% match