Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

d3

Public visualization

Viewing a saved revision (read-only)

3df9e0f160ae424e9b46c781350258bb

d3

0 stars0🌍 Public
Eelgato_1994
Last edited Apr 20, 2023
Created on Apr 18, 2023

This example demonstrates masked striped patterns overlaid on top of each other. It creates 100 horizontal rectangles and 100 vertical rectangles, each with a height or width of 10 pixels, spaced 20 pixels apart. The rectangles are masked using SVG masks with circular cutouts, creating a crosshatch effect with a circular reveal. The visualization uses D3 v6 with `select`, `selectAll`, and `data` joins to bind the mark arrays to the SVG elements, rendering the output as SVG in a React-styled HTML page.

AI-generated description

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

See also React Starter.