Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Scatter Plot with Image Mask

Public visualization

Viewing a saved revision (read-only)

32d862f7978e4ac19fa54fbe4bfebb0b

Scatter Plot with Image Mask

0 stars0🌍 Public
GGiuliaPassoni
Last edited May 4, 2023
Created on May 3, 2023

This example shows a scatter plot transformed by an SVG image mask, where a circular region filled with a photographic image is revealed through a pattern of 1,000 randomly generated points. The points are generated using a custom `generateRandomPoints` function and drawn as white circles inside a mask, while a pattern element loads an external BBC news image. D3 v6 selections, the `mask` and `pattern` SVG elements, and radius-based circle rendering combine to create the effect, with the mask applied only to the central circle rather than the entire SVG canvas.

AI-generated description

Testing scatter plot masks.