ISHAAN DEEP SINGH

@ISHAANDEEP22·3 public vizzes

Fork of Sol LeWitt Reproduction with Javascript

This example reproduces a Sol LeWitt wall drawing as a generative SVG composition. It shows a series of vertical black bars covering the full height of the browser window, overlaid with horizontal black lines that step diagonally across the canvas. The code uses the Document API to create SVG elements, including nested `rect` and `circle` nodes, with two partially commented-out circle masks that would limit the drawing’s visible area. The piece dynamically sizes to the viewport, using a fixed 20-pixel spacing for vertical bars and a 10-pixel step for the diagonal lines.

Feb 5, 2026

Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction with D3

This example recreates a Sol LeWitt wall drawing as a visual grid of alternating horizontal and vertical lines, with a circular void cut through the center to reveal a layered, woven effect. The rendering uses D3 selections and the `.join()` method to generate and update SVG `<rect>` elements across the full canvas. Two SVG `<mask>` definitions combine black and white circles and rectangles to selectively hide portions of the line groups, creating the illusion of intersecting bands around an empty circle. The result is a clean, geometric composition driven entirely by D3’s data-binding utilities.

Feb 5, 2026

Loading thumbnail…

SVG Basics

This example demonstrates basic SVG shape drawing and composition in a static 2D scene. It uses raw SVG elements—`rect`, `circle`, and `line`—positioned across a 1000×900 canvas to construct a simple object with green, yellow, white, and red parts, including a central door and flanking red circles. The rendering relies on inline SVG attributes like `fill`, `stroke`, and `stroke-width`, with styling partially defined in an external `styles.css`. No JavaScript or data-driven logic is applied; the visualization is entirely hardcoded in HTML.

Feb 4, 2026