Serge

@devsergeraskin·2 public vizzes

Fork of D3 Selection Exploration

This example explores D3 data joins and SVG animation as a sine wave drives a changing dataset. A set of circles and connecting lines is redrawn on each frame, with the line stroke-width bound to each circle’s radius. The code uses `d3.select`, `selection.data`, and `.join()` to update shapes, while `d3.range` and `scaleLinear` in `makeData` generate positions and sizes.

Sep 26, 2023

Loading thumbnail…

Fork of Sol LeWitt Reproduction

A generative rendering of a Sol LeWitt-inspired geometric composition uses SVG masks to reveal intersecting horizontal and vertical line grids. The artwork first displays 100 horizontal rects, masked by a central white circle, then overlays 100 vertical rects masked by an inverted circle, creating a cross-shaped overlap of striped bands. Built entirely with native browser APIs, the code manipulates SVG elements directly via `document.createElementNS`, setting `mask` attributes to alternate visibility across the two circular regions. No external libraries are used; the piece relies on simple `rect` elements, SVG `mask` definitions, and coordinate calculations based on `window.innerWidth` and `window.innerHeight`.

Sep 23, 2023