Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Thesis Viz

Public visualization

Viewing a saved revision (read-only)

4ec89305ca6545409aa1c3971903d13d

Thesis Viz

0 stars0🌍 Public
Pplueckeb@rptu.de
Last edited Jul 17, 2024
Created on Jul 17, 2024

This data-art piece generates a dynamic visual composition using an HTML5 Canvas and the D3.js library. It creates 100 horizontal and 100 vertical lines that intersect across the viewport, with each line masked by a set of D3 shape symbols. The horizontal background lines are partially hidden by a mask containing the symbols in white, while the foreground vertical lines use an inverted mask, so the symbols appear alternately cut out and filled. The result is a grid of stripes that reveal the seven distinct D3 glyphs (including circles, squares, and triangles) at the center, demonstrating the library's shape-rendering capabilities through the `d3.symbol` API in an abstract, generative design.

AI-generated description

"Get it Right in Black and White", Episode 4

using D3 shapes / symbols