Skip to main content
100%

Fork of Svelte + D3: Canvas & renderless components

✓ Published0🌍 Public
Rrudi.oreillymeehan@gmail.com
Last edited Oct 1, 2024
Created on Oct 1, 2024

This example shows 34,000 circles on a canvas, each updated every five seconds with random positions and radii. A Svelte renderless component system separates canvas management from rendering logic: a canvas component provides a draw context, while circle components register individual draw functions and use Svelte's `tweened` motion with `cubicOut` easing to animate transitions between data updates. The visualization uses D3's `scaleLinear` and `scaleSequential` with `interpolateMagma` to map random values to coordinates and colors.

AI-generated description
MIT Licensed

Similar vizzes