Velocity

Velocity from samples: between for two values a frame apart, and trailing for a pointer's last 100 ms, as a drag's release reads it. A value an animation moves carries its own velocity on its frames, so it needs neither.

import * as Velocity from "@wardic/core/Velocity"

const { x, y } = Velocity.trailing(points) // pixels a second, from the pointer's recent points

Interfaces

TimedPoint

A pointer's position, and when it was there, in milliseconds, as an event's timeStamp gives it.

Properties

timeStamp
readonly timeStamp: number;
x
readonly x: number;
y
readonly y: number;

Functions

between()

function between(
   previous, 
   current, 
   dt
): number;

The velocity between two samples dt seconds apart, in their units a second: between(10, 16, 1 / 60) is 360. 0 when dt is 0.

Parameters

previous

number

current

number

dt

number

Returns

number


trailing()

function trailing(history, windowMs?): Point;

A pointer's velocity over its last windowMs (100 by default), in its units a second, from its points oldest first: from the newest point older than the window to the last. A pause before a flick doesn't slow it: when that point is the first, more than twice the window old, and there are more, it starts from the second instead. { x: 0, y: 0 } for fewer than two points. Motion's getVelocity, as a drag's release reads it.

Parameters

history

readonly TimedPoint[]

windowMs?

number = 100

Returns

Point

Example

const points: Array<Velocity.TimedPoint> = []
// At each move of the pointer:
points.push({ x, y, timeStamp })
// At its release:
fling(Velocity.trailing(points))