🌍 Public
Viewing a saved revision (read-only)
609c02eef4914a3a8ec6802a199c1b1e
SVG and Javascript
This example demonstrates how SVG masks can dynamically composite shapes to create an intricate visual pattern. Two circular masks—one black and one white—are layered with alternating sets of thin rectangular stripes, generating a crosshatched grid that reveals or hides sections of the canvas. The code uses raw JavaScript DOM manipulation with `document.createElementNS` to build SVG elements dynamically, computing positions based on `window.innerWidth` and `window.innerHeight`. No external libraries are employed; the rendering relies entirely on native SVG mask and rectangle elements.
AI-generated descriptionAn approximation of a scatter plot and a bar chart