Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Smiley Complexity

Public visualization

Viewing a saved revision (read-only)

7dbc05829c204247a2601ba4b9e83c0e

Smiley Complexity

0 stars0🌍 Public
ZZoe Ferencova
Last edited Mar 6, 2023
Created on Mar 6, 2023

A grid of 18 randomly generated smiley faces demonstrates how small variations in component parameters create visual complexity. Written in React with D3 v7, the visualization uses a `d3.range` and `Math.random` to assign each face different stroke widths, eye offsets, eye radii, mouth radii, and mouth widths. The `d3.arc` API generates the mouth path, while modular React components (`Face`, `Eye`, `Mouth`, `FaceContainer`) compose the SVG rendering. The faces are drawn via SVG circles and paths, showcasing reusable component-based data visualization.

AI-generated description

Half way towards a smiley face.