Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

SVG fundamentals

Public visualization

SVG fundamentals

0 stars0🌍 Public
YYoon Han
Last edited Nov 13, 2024
Created on Nov 12, 2024

This example demonstrates how to construct and render an SVG scene using only native browser APIs, without D3.js. It shows 100 alternating black and white vertical rectangles that fill the entire window width and height. The code creates an SVG element dynamically via `document.createElementNS` and sets its dimensions to match `window.innerWidth` and `window.innerHeight`. Each rectangle is then appended to the SVG with a width of 10 pixels, producing a striped pattern. The rendering approach relies entirely on manual SVG attribute manipulation rather than data-binding or visualization libraries.

AI-generated description

D3.js tutorial. link

Comments

Sign in to join the discussion.

MIT Licensed