Skip to main content
SimilarExport ZIP
100%

js basics

✓ Published0🌍 Public
YYingkai Song
Last edited Dec 2, 2022
Created on Dec 2, 2022

This example reproduces a Sol LeWitt art piece using D3.js. The visualization is rendered in an HTML page with a minimal setup, while the core logic resides in a JavaScript file that uses D3’s array mapping API to transform a range of numbers. The code applies `map` to the array `[1, 2, 3, 4]`, multiplying each value by 2 and logging the result to the console, demonstrating a basic functional programming pattern in D3. No graphical output is drawn; the piece focuses purely on the programming foundation.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

JS in HTML

This example reproduces a Sol LeWitt art piece using D3 v7. The code imports D3’s `select` function and logs it, along with strings built from custom modules `something.js` and `thing.js` that export default and named values. The HTML page sets a large font size and centers the body, though no DOM elements are appended or manipulated, so the visualization is limited to the console output demonstrating module imports and D3’s availability.

Ccssergio
82% match
Loading thumbnail…

JS Basics

This visualization reproduces a Sol LeWitt art piece using SVG rendering. The code demonstrates JavaScript fundamentals—variables, objects, loops, and functions—through commented examples, while the active script creates an empty SVG canvas with dimensions of 960 by 500 pixels. The example serves as a teaching tool for basic programming concepts, using vanilla JavaScript to manipulate the SVG element directly.

Mmegan-grannan
81% match
Loading thumbnail…

Javascript Basics

This example reproduces a Sol LeWitt art piece using an SVG canvas. The code renders a static geometric composition, relying entirely on JavaScript basics and DOM manipulation via an SVG element. No external libraries are used; instead, the visualization demonstrates fundamental programming constructs—variables, loops, functions, and object literals—through commented-out teaching examples. The active drawing is minimal, with the SVG’s height and width set to 960 and 500 pixels, and remains unchanging, focused on illustrating code structure rather than dynamic data.

Yyejichun@naver.com
78% match
Loading thumbnail…

JavaScript Basics

This visualization reproduces a Sol LeWitt art piece using an SVG canvas designed with a 960-by-500 pixel coordinate system. The drawing is generated entirely through JavaScript code that is commented out in the HTML file, with the script containing basic programming examples, such as variable declarations, functions, and object literals. The rendering relies on the raw SVG `<svg>` element and the browser’s JavaScript engine, with no external libraries or data sources; the visual output is determined solely by the geometric arrangement of shapes coded in the script.

Pprospirity
77% match
Loading thumbnail…

Sol Lewitt in only JS

This example recreates Sol LeWitt’s geometric wall drawings using only JavaScript and D3. It renders a series of abstract, rule-based compositions—lines, arcs, grids, and color bands—on an SVG canvas. The code implements each drawing as a separate function that generates SVG elements using D3’s selection and data-binding methods, with shapes built from `d3.line`, `d3.arc`, and `d3.area` generators. Coordinates are computed mathematically, and the drawings are displayed in a grid layout, showcasing how algorithmic instructions translate into visual form without external data sources.

Ppirani.sabah@gmail.com
77% match
Loading thumbnail…

JS basics

This example reproduces a Sol LeWitt art piece using an SVG canvas and plain JavaScript. The code defines a `person` function that returns an object with `first` and `last` properties, then logs the result for "John Doe" to the console. The page contains an empty SVG element with a fixed width and height, while commented-out lines show basic JavaScript concepts like variables, loops, and arrow functions. The visualization itself is not generated, serving only as the static canvas for the art reproduction.

IIgorGorin00
77% match
Loading thumbnail…

JavaScript Basics Array

This example demonstrates fundamental JavaScript array operations through the D3 library. The code uses `d3.select` and `d3.range` to create an SVG container, though no explicit data is rendered visually. Instead, the example focuses on array manipulation methods including custom range generation, sorting with comparison functions, and console output of results. It reproduces a Sol LeWitt art piece concept while experimenting with array methods like `sort`, `filter`, `forEach`, and `reverse` on hardcoded numeric arrays. The rendering approach uses an SVG element sized 960×500 pixels, with all operations logged to the browser console.

Ccssergio
77% match
Loading thumbnail…

Javascript Basics

This example reproduces a Sol LeWitt art piece as an SVG visualization. The code renders an empty SVG canvas of 960 by 500 pixels, with the artwork itself absent from the displayed output. The JavaScript provided is entirely commented out, containing introductory lessons on variables, functions, objects, and control flow. While the file references the art piece, the actual drawing logic is not implemented, leaving the visualization blank.

Aajoua
76% match