Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Svelte + D3: Phyllotaxis layout (irrational 2)

Public visualization

Viewing a saved revision (read-only)

a1cbe5f709f74e218d4800c7246e28d7

Svelte + D3: Phyllotaxis layout (irrational 2)

0 stars1🌍 Public
MMatthias Stahl
Last edited Nov 26, 2025
Created on Feb 10, 2024

A generative arrangement of 1000 circles follows a phyllotaxis spiral, offset by an irrational angle derived from 1+√2. Each circle is colored with a warm sequential scale from D3, and the innermost circle briefly turns transparent in sequence via a timed activeCircle index, creating a wave-like fade. Rendered as SVG within a Svelte component, the layout is computed by a custom `layoutPhyllotaxis` function using D3’s `scaleSequential` and `interpolateWarm` for color mapping, with smooth CSS transitions animating the opacity changes.

AI-generated description