Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Full Fork of D3 Starter

Public visualization

Viewing a saved revision (read-only)

cf079bf3b15c4c63a762672aa98f2fd9

Full Fork of D3 Starter

0 stars1🌍 Public
Llt_vandegrift@live.com
Last edited May 1, 2024
Created on May 1, 2024
Forked from D3 Starter

This example demonstrates how D3 SVG masks can create overlapping geometric patterns. It generates 100 horizontal and 100 vertical rectangles, then applies two distinct masks with inverted fill rules to reveal or hide different regions. The code uses D3’s `select`, `range`, `symbols`, and `symbol` APIs to draw predefined symbol shapes within each mask. The visualization fills the browser window, with symbol paths placed at regular intervals across the width, producing a dynamic interplay between the grid lines and masked shapes.

AI-generated description

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

See also React Starter.