Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt Reproduction with D3

✓ Published0🌍 Public
Iibrarmunircoder
Last edited Jun 9, 2022
Created on Jun 9, 2022

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.

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
96% 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
95% 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
95% 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
95% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3. It draws a grid of horizontal and vertical rectangles that are masked by two circles, creating a pattern of alternating lines within circular cutouts. The code uses D3’s `select` and `range` functions to generate SVG elements, and applies SVG masks with `circle` elements to clip the rectangles. The artwork is rendered as an SVG, filling the browser window.

Rrwata97
95% 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
95% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3.js version 6 and SVG rendering. The visualization shows a grid of horizontal and vertical rectangles, with two circular masks creating a layered geometric pattern where the lines alternate visibility. The code employs `d3.select`, `d3.range`, and the `join` method to generate 100 rect elements for each orientation. SVG masks—defined with distinct IDs and circles of white and black fills—control which line segments appear within the overlapping circular regions.

PPeter Prevos
95% match
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