Skip to main content
SimilarExport ZIP
100%

Sol LeWitt Reproduction with D3-Fork1

✓ Published0🌍 Public
Rrajibbanerjee
Last edited Feb 8, 2023
Created on Feb 8, 2023

This reproduction of a Sol LeWitt artwork uses D3.js (v6) to draw a series of horizontal rectangles that fill the browser window. The piece shows a minimalist grid of 100 thin, full-width bars stacked vertically, each 10 pixels tall with 20-pixel spacing, rendered as SVG elements. The code leverages D3’s `select`, `range`, and `join` APIs to bind data to SVG `<rect>` elements, using the window’s inner dimensions to scale the artwork responsively. The rendering is pure SVG, with no external data source.

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 visualization reproduces a Sol LeWitt art piece using D3 v6, rendering 100 horizontal and 100 vertical rectangles as SVG elements. The rectangles are masked to reveal only a circular region at the center of the canvas, creating an overlapping grid pattern reminiscent of the original work. The code uses D3’s `select`, `range`, and `join` methods to bind data and generate the SVG shapes, with two `mask` definitions controlling the visibility of the crossing bars.

DDyor69
90% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3.js, generating a grid of thin horizontal and vertical rectangles across the full browser window. The visualization appears as a dense crosshatch pattern, with a circular region in the center where the lines are inverted—dark lines show through a light circle, while the surrounding area has light lines on a dark background. The code builds an SVG, creates rect elements with D3’s `range` and `join` methods, and applies two SVG masks with circles to achieve the contrasting effect.

FFerasMorsi
89% 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
89% 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
89% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using D3.js, displaying a grid of horizontal and vertical thin rectangular bars across the full viewport. The bars are partially revealed through two circular masks, creating a geometric pattern of intersecting lines within a central circular region. Using d3.select and range, the code generates 100 rect elements in each orientation, applying SVG mask elements with contrasting black-and-white fills to selectively show vertical bars inside one circle and horizontal bars inside another. The rendering is entirely SVG-based, with the artwork adapting to the browser window dimensions.

Llukasilg.sol@gmail.com
89% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3, rendering 100 horizontal and 100 vertical rectangles that intersect in a grid-like pattern. The visualization shows a central circular area where the rectangles are visible, while the surrounding regions are masked out. It uses d3.select to create an SVG, d3.range with data joins to generate the rectangles, and SVG mask elements with circles to create the circular cutout effect. The code iterates through both orientations to layer the marks.

Aaalyousfi
89% match
Loading thumbnail…

Sol LeWitt Reproduction with d3

This piece reproduces a Sol LeWitt drawing using D3 and SVG renderings. Two sets of 100 thin rectangles are drawn—one horizontal and one vertical—creating a grid-like pattern. Each set of rectangles is masked by a circular region: the horizontal bars use a mask with a central white circle on black, while the vertical bars use an inverse mask with a black circle on white. The result shows a grid within a circular window, with the horizontal and vertical lines swapping visibility inside and outside the circle. The code uses `d3.select`, `d3.range`, `svg.append`, and `.join()` to build the SVG elements and masks programmatically.

Yyankesswang
88% match
Loading thumbnail…

Fork of Sol LeWitt reproduction with d3 _ 2

This SVG reproduction of a Sol LeWitt piece uses d3 to generate two overlapping sets of rectangular grids. The code creates horizontal and vertical bars, each masked to reveal either a central circular area or the surrounding region. Using d3’s `select` and `range`, it appends a full-window SVG and populates group elements with 100 rectangles each. The inner mask highlights a 200-pixel-radius circle, while the outer mask inverts this shape, producing the characteristic geometric interplay.

AAngela Kochoska
88% match