Easing function based on svg path
npm install path-easingTween a given t value based on a bezier curve specified in SVG path data format.
js
import pathEasing from 'path-easing';const extremeInOutEasing = pathEasing('M0,100 C40,100 50,90 50,50 C50,10 60,3 100,0', { samples: 200 });
console.log(extremeInOutEasing(0.5)); // 0.0019976899246115787
`$3
* sampleCount: default: 300 The number of samples to generate. The larger the
number the more accurate the easing, at the expense
of initialization time.
*
height: default: 100 The height of the assumed viewBox.
*
width: default: 100 The width of the assumed viewBox.
$3
$3
Edit on Sketch / Illustrator the copy the path: d="[path]".
`svg
``Credits to: Tim Lucas https://codepen.io/toolmantim/pen/bpgXaM
Inspired by Oleg Solomka’s work on http://mojs.io/