Sol Lewitt reproduction

100%

Sol Lewitt reproduction

✓ Published0🌍 Public

Last edited Sep 3, 2025

Created on Sep 3, 2025

This example demonstrates the foundational construction of SVG graphics through JavaScript. It shows a single blue square rendered on an HTML page, created programmatically using the Document Object Model (DOM) API. The code first creates an SVG element with specified dimensions and a border, then appends a rectangle with set coordinates, size, and fill color using `createElementNS` and `setAttribute` methods. The example serves as a basic introduction to the SVG library's core functionality for positioning and styling shapes.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol LeWitt

This example draws a single red square onto an SVG canvas, echoing the minimalist geometric style of Sol LeWitt. The code creates SVG elements using the native `document.createElementNS` API for SVG, adds a `rect` with fixed width and height attributes, and appends it to the page. It demonstrates fundamental SVG rendering with vanilla JavaScript, setting the stage for further generative art.

SSantiago Toso

86% match

Loading thumbnail…

Sol LeWitt reproduction

This example demonstrates the basics of SVG shape creation through a minimal script that appends a single rectangle to the document. A JavaScript script dynamically generates an SVG element, sets its width to 960 pixels, and appends a rect element using the standard DOM API (`createElement`, `setAttribute`, `appendChild`). The code uses raw SVG without external libraries, showing how to construct vector graphics programmatically. The page hides overflow and margin, making the shape appear in an otherwise blank canvas, though the rectangle’s height is misspelled as "hight" and remains unset.

Aaidarshafeev1@gmail.com

85% match

Loading thumbnail…

Sol Lewitt Reproduction

This example demonstrates basic SVG shape construction in a 960×500 viewport, using raw SVG elements without any external libraries. It shows two overlapping red and green circles at the same coordinate to illustrate layering, a navy diagonal line from the top-left corner, a horizontal path drawn as a rounded rectangle outline, and an unclosed black polyline with a right-angle bend. The code renders directly in the browser via inline `<svg>` markup, with commented-out elements indicating exploration of rectangle styling. It also embeds a YouTube video about SVG fundamentals for reference.

Ssirenajbpearl@gmail.com

85% match

Loading thumbnail…

Sol LeWitt reproduction

This example reproduces a Sol LeWitt drawing using an SVG canvas. It shows a single black square rectangle positioned at the top-left corner of a 960×500 pixel viewport. The code creates the SVG and rectangle elements dynamically using the DOM API `document.createElementNS` with the SVG namespace, then appends them to the page body. The rectangle’s dimensions are set via `setAttribute`, though its fill color is commented out, leaving it with the default black.

SSantiago Toso

84% match

Loading thumbnail…

Sol Lewitt Reproduction - SVG

This example reproduces a Sol Lewitt conceptual drawing using only SVG and JavaScript. It renders two sets of horizontal and vertical striped rectangles that are masked to reveal a central circle, with each line pattern clipped differently to create the interplay of shapes. The code dynamically generates SVG elements via the DOM API, using masks and circles to control visibility, and adapts the artwork to the full browser window dimensions.

AAdil Zeshan

84% match

Loading thumbnail…

Sol Lewitt Reproduction

This example reproduces a Sol LeWitt wall drawing as a single static SVG rectangle, using a plain SVG element with a width and height set to 960 by 500 pixels. The code manually creates the SVG and a 100-by-100 rect child via the Document Object Model’s `createElementNS` method, relying on raw JavaScript rather than a charting library. It demonstrates basic SVG rendering with a fixed canvas, though the script appends the rect to the SVG before the document’s existing SVG is used, resulting in a minimal structural output. The work shows how geometric abstraction can be encoded directly through SVG API calls.

DDavid Hojdan

84% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired drawing using only browser-native SVG and JavaScript. It shows a field of thin blue horizontal lines covering the full viewport, overlaid with a row of concentric white circles, and one fully filled white circle at the center. The code creates these shapes imperatively via the SVG DOM API, appending `rect` and `circle` elements inside a loop. It uses `document.createElementNS` for SVG namespace creation and `setAttribute` for geometry, with dimensions tied to `window.innerWidth` and `innerHeight`.

Aainhoadieruiz@gmail.com

84% match

Loading thumbnail…

Sol Lewitt Viz-Part II

This example demonstrates the fundamentals of programmatic SVG rendering through the creation of a single black vertical rectangle on a white canvas. The visualization combines an SVG element with a rectangle, both generated entirely through JavaScript’s `createElementNS` method and appended to the document body. The code specifies the SVG namespace, sets the canvas dimensions to 500 by 500 pixels, and positions the rectangle at an x-coordinate of 90 with a width of 10 and height of 300. The work is inspired by Sol LeWitt’s geometric art, using a minimal approach that highlights basic vector graphics construction.

Rraturi22@gmail.com

84% match