Scrolling

100%

✓ Published0🌍 Public

Last edited Mar 29, 2023

Created on Mar 29, 2023

This piece reproduces a Sol LeWitt wall drawing as a slowly shifting field of black lines on a white background. The lines bend and scroll continuously as their endpoints follow animated paths, creating a dynamic, generative composition. The code uses `d3.forceSimulation` to compute the evolving positions of the line vertices, with `requestAnimationFrame` driving the redraw of the SVG elements. It relies on d3.v7 and the DOM directly, with no external data source beyond the geometric rules of the artwork.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol Le Witt practice

This visualization recreates Sol LeWitt’s geometric wall drawings as an interactive abstract composition. It shows a dense grid of lines and arcs that respond to mouse movement, with overlapping strokes and subtle color shifts. The piece uses d3.forceSimulation to animate the positions of line endpoints, while a canvas rendering loop draws the paths each frame. Input data comes from a predefined set of coordinates and angles, not from an external dataset. The code relies on D3’s scale functions and the Canvas API, with no additional libraries beyond D3.

Ppanthabuddhi@gmail.com

81% match

Loading thumbnail…

Untitled

This example reproduces a Sol LeWitt wall drawing as an interactive visualization, showing how a set of algorithmic rules generates a complex geometric composition. A force-directed layout using `d3.forceSimulation` positions a grid of nodes, while SVG paths are drawn with `d3.line` and `d3.curveBasis` to create the characteristic arcs and straight segments. The code reads a local data file defining the drawing’s parameters and renders them in a browser window, with user interaction via mouse events to pause or restart the simulation. The result is a faithful, animated tribute to LeWitt’s instructions-based art.

MMonWas

79% match

Loading thumbnail…

Sol LeWitt reproduction with d3

This example reproduces a Sol LeWitt wall drawing using D3.js, rendering a grid of intersecting horizontal and vertical rectangles as SVG elements. The artwork shows a dense cross-hatch pattern that gradually disappears within a central circular region, creating a stark contrast between the outer textured area and the empty circle. The code generates 100 lines in each direction using `d3.range` and `selectAll(...).join('rect')`, then applies two SVG masks (`inner-mask` and `outer-mask`) to selectively reveal or hide the lines. The piece scales to the full browser window size.

AAngela Kochoska

77% match

Loading thumbnail…

Sol LeWitt Reproduction with D3

This piece recreates a Sol LeWitt wall drawing using D3.js to generate layered, mask-based geometric forms. It displays a grid of horizontal and vertical lines that intersect within a central circular region, creating a dynamic visual pattern. The code uses the D3 selection API and raw SVG elements, employing two circular masks to selectively reveal the line structures. The rendering is dynamically sized to fit the browser window, producing an interactive, generative art experience.

Ssean@wall.ninja

77% match

Loading thumbnail…

Sol LeWitt reproduction with D3

A full-screen SVG shows a grid of thin horizontal and vertical black lines, masked to reveal a central white circle on a black background. The piece reproduces a Sol LeWitt wall drawing: horizontal bars cross the entire canvas, while vertical bars are visible only outside a centered black circle. Using D3 selections and `range`, the code generates 100 rects for each orientation, then applies two SVG masks—one with a white circle to show the horizontal lines within it, and another with a black circle to hide the vertical lines there. The result creates a subtle interplay of line directions across the circular boundary.

ZzolboBatsaikhan

76% match

Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This visualization reproduces a Sol LeWitt wall drawing using D3.js, rendering a grid of horizontal and vertical lines that intersect to form a subtle pattern across the full browser viewport. The piece relies on two SVG masks—one circular and one rectangular—to selectively reveal or hide portions of the line arrays. Specifically, a path generated via `symbol(symbols[1],100000)` creates a large circular mask over the vertical lines, while a black circle mask obscures the horizontal lines in a contrasting region. The code uses D3’s `select`, `range`, and `join` APIs to efficiently append hundreds of SVG rect elements, with all rendering performed client-side in SVG format.

Gguts

76% match

Loading thumbnail…

Sol LeWitt reproduction

This example reproduces a Sol LeWitt wall drawing as a dynamic, algorithmic visualization. It shows a grid of colored squares whose hues gradually shift and blend over time, creating a living, patterned composition. The work uses D3.js to construct and manipulate SVG elements, with colors derived from an interpolated palette. The rendering relies on JavaScript timers or animation frames to cycle through color values, updating the fill of each rectangle to mimic LeWitt’s serial, rule-based aesthetic. The code is minimal, containing no external data or complex geometry, focusing purely on the interplay of color and grid structure.

PPolydexter

76% match

Loading thumbnail…

Sol LeWitt Reproduction (D3)

This example reproduces a Sol LeWitt-style wall drawing using D3.js, generating a grid of black vertical and horizontal lines across the full browser window. The code computes line positions from fixed gaps between margins, creating 18 vertical and 9 horizontal lines with red strokes on the vertical set. It renders as SVG via D3 selections and the `join()` method, using `d3.range`-like loops and data arrays built from `window.innerWidth` and `innerHeight`. No external dataset is loaded; the drawing is purely generative.

AAlpineStranger

76% match