Motion

Defined in: packages/react/src/MarkCanvas.tsx:20

How marks move when the view changes. SVG animates only so many marks smoothly, so above each limit the change is instant instead of stuttering. Under prefers-reduced-motion nothing moves.

Properties

fade?

optional fade?: number

Defined in: packages/react/src/MarkCanvas.tsx:30

Colours, fills and lightness fade while there are at most this many marks. Defaults to 400: fades on top of a glide cost a third of the frame rate at 600 marks, and nothing at 400.

---

glide?

optional glide?: number

Defined in: packages/react/src/MarkCanvas.tsx:25

Marks glide to their new places while there are at most this many. Defaults to 800: about what SVG animates smoothly enough (43-50 fps in Chrome); 1,500 gliding marks fell to 16-27 fps.