sol lewit full exs

100%

sol lewit full exs

✓ Published0🌍 Public

Last edited May 5, 2023

Created on May 5, 2023

This example displays a dense grid of thin, overlapping horizontal and vertical rectangles across the full screen, creating a woven, textile-like pattern. The code uses d3.select to build an SVG, then applies two d3.mask elements to reveal symbols from a set of d3.symbols, with each mask inverted to produce alternating cross-shaped cutouts. The composition shows how repeated geometric shapes can be filtered through masks to create intricate visual textures.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

d3 sol lewit full

This example generates a geometric line pattern using D3.js and SVG, rendering a grid of horizontal and vertical rectangles across the full browser window. Two masks, one inverted, create a cross-shaped cutout in the center by selectively hiding or revealing the rectangular bands. The code uses D3’s `select`, `range`, `symbol`, and `symbols` APIs to build the SVG elements, while `mask` elements with paths control the visibility. The design is inspired by Sol LeWitt’s minimalist wall drawings, with the cross motif emerging from the overlapping masked layers.

HHéloïse Feldmann

89% match

Loading thumbnail…

Sol LeWitt exercise

This visualization generates a grid of horizontal and vertical rectangles on an SVG canvas, creating a woven pattern inspired by Sol LeWitt’s geometric art. Two masks, each containing a large D3 symbol shape, invert the fill of the intersecting lines to reveal the glyphs as negative space. The code uses D3 selections and data joins to render 100 rows and columns, with mask IDs applied via the `attr` method and custom mask rendering logic. The result is a dynamic interplay of line and form, driven entirely by D3’s `range`, `symbol`, and `symbols` APIs.

CC-Marfil

87% match

Loading thumbnail…

Full Sol Lewitt Reproduction with D3

This visualization reproduces a Sol LeWitt wall drawing using D3.js to generate a grid of alternating horizontal and vertical stripes across the full screen. Two masks—one inverted—cut circular symbol shapes from the stripe patterns, creating overlapping geometric forms. The code uses d3.select, d3.range, d3.symbol, and d3.symbols to render SVG paths, with each mask applied via SVG mask elements. The result is a dynamic, screen-filling composition that highlights D3's ability to create intricate generative art from simple primitives.

PPhan Nguyen

86% match

Loading thumbnail…

Full Sol LeWitt Reproduction with D3

This example shows a large grid of horizontal and vertical stripes that appears to be interwoven, with geometric symbols such as circles, diamonds, and triangles emerging from the pattern. It generates 100 striped bands in each direction and uses two SVG masks to selectively hide portions of the grid, creating the illusion of layered shapes. Built with D3 v7 and React, the code uses `select`, `range`, `symbols`, and `symbol` to draw the mask paths, with `renderMask` applying the inverted fill logic. The rendering approach is purely SVG-based, sized to the full browser window.

Ccharlieronchetti@gmail.com

86% match

Loading thumbnail…

full Sol LeWitt-d3

This example displays a full-screen grid of horizontal and vertical stripes within two circular masks, creating an overlapping pattern of lines at the center of the viewport. The visualization generates 100 rectangles for each orientation using `d3.range`, appending them to SVG groups via `d3.select` and the `join` operation. Two SVG masks, one with a black background and white circle and the other inverted, control visibility of the stripes, producing a dynamic interplay of crisp bands within the circular boundaries. The rendering is built with React, uses the d3 library version 6.6.1, and outputs to SVG.

Bbillzhou2005

86% match

Loading thumbnail…

Sol LeWitt with d3

This example uses React and d3 to render a grid of horizontal and vertical rectangles, creating a pattern inspired by Sol LeWitt. The code uses `d3.select` and `d3.range` to generate 48 rectangles per axis, each masked by a circular shape. Two SVG masks—one with a white circle on black, the other with a black circle on white—are applied to the respective sets, producing a cross-hatching effect inside the circle and a contrasting negative space outside. The rendering targets a full-window SVG.

Mmax-31

86% match

Loading thumbnail…

Full Sol LeWitt Reproduction With D3

This example reproduces a Sol LeWitt-style drawing using D3.js, rendering a full-screen SVG composed of 100 horizontal and 100 vertical stripes that are masked by two overlapping circular forms. The code directly uses `d3.select`, `d3.range`, and the `join` API to append and position the rectangles, while `d3.symbol` and `d3.symbols` generate the circular mask paths. The two masks, one inverted, are applied via the `mask` attribute to create a subtle interplay between the grid and the geometric shapes. The visualization responds to the browser window’s dimensions, as the width and height are taken from `window.innerWidth` and `window.innerHeight`.

Wwgloss

85% match

Loading thumbnail…

Sol Lewitt vertical

This example uses D3.js to render an SVG visualization inspired by Sol LeWitt’s geometric wall drawings. It creates a grid of alternating horizontal and vertical rectangles, where each set is restricted to a circular region using SVG masks with white and black fills. The first mask reveals a circle of horizontal bars, while the second exposes vertical bars around it, producing an interlocking checkerboard-like pattern. The code leverages d3.select, d3.range, and SVG mask and rect elements to generate the pattern.

AAnshul Rawat

85% match