ionakeeley

@ionakeeley·3 public vizzes

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.

Jan 27, 2023

Loading thumbnail…

Fork of Sol horizontal

A horizontal sequence of semi-transparent rectangles forms a striped pattern across the screen, with a circular mask revealing only the central region. The visualization uses raw SVG DOM manipulation via `document.createElementNS` and `setAttribute`, creating 100 rectangles positioned at increasing y-coordinates. A white circle and rectangular mask define the visible area, while the remaining stripes fade into the background. No external libraries are used; the code relies solely on native browser APIs for rendering.

Jan 27, 2023

Loading thumbnail…

Sol vertical

Sol vertical renders a vertical field of 100 static SVG rectangles, each 10 pixels wide and spaced 20 pixels apart, filling the full window height. The example uses the SVG namespace via `document.createElementNS` to construct the rectangles directly in JavaScript, with no external libraries. The visualization is purely geometric, showing a uniform grid-like pattern of striped bands that cover the browser viewport from top to bottom.

Jan 27, 2023