Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

SVG Fundamental

Public visualization

SVG Fundamental

0 stars1🌍 Public
PPhilip W
Last edited Dec 22, 2025
Created on Dec 21, 2025
Forked from React & D3 Starter

This example creates a full-screen SVG image built entirely from programmatically generated rectangles. It demonstrates two different mask patterns that reveal a central circular area, with one mask applied to horizontal bars and another to vertical bars. The code uses D3.js version 6.6.1, specifically the `selection` module, alongside vanilla JavaScript DOM manipulation with `document.createElementNS` and SVG attributes. The rendering approach shows raw SVG element creation without using D3's data join or helper functions.

AI-generated description

SVG Fundamental

This project demonstrates the integration of D3.js and React.

Setup

Install dependencies:

Comments

Sign in to join the discussion.

MIT Licensed