Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

SVG fundamentals

Public visualization

Viewing a saved revision (read-only)

4886bdb04f414c98b88bca3619c9899f

SVG fundamentals

0 stars1🌍 Public
Mmuhmdabdollahi@gmail.com
Last edited Jan 23, 2025
Created on Dec 29, 2024
Forked from HTML Starter

This example demonstrates the foundational use of SVG by creating an empty drawing surface and placing a single small rectangle on it. The code creates SVG elements programmatically using the `document.createElementNS` API with the SVG namespace, setting the canvas dimensions to 960 by 500 pixels. A rectangle is then added at coordinates (100, 100) with a width and height of 10 pixels each. This bare-minimum approach, using plain JavaScript without any libraries, illustrates how to construct vector graphics from scratch for later data visualization.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.