Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Dom Manipulate

Public visualization

Viewing a saved revision (read-only)

54a1891156ae42c78811d5183ab69a8c

Dom Manipulate

0 stars1🌍 Public
Mmfgok
Last edited Sep 20, 2022
Created on Sep 20, 2022
Forked from SVG Fundamentals

This example demonstrates how SVG masks can create geometric patterns by layering horizontal and vertical stripes over a circular cutout. The code manually constructs SVG elements using the DOM API, creating a full-screen SVG with two masks: one revealing a circle of horizontal stripes and another revealing the inverse. One hundred turquoise rectangles are generated for each orientation, with the masks controlling visibility through white and black fill values. The visualization highlights fundamental SVG manipulation techniques without relying on a visualization library, though D3 is listed as a dependency.

AI-generated description

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

See also React Starter.