animate-svg

animate-svg

Easily animate an SVG line or path to look like it's animating itself.

Installation

npm install --save animate-svg

Usage

Basic usage:

import animateSvg from 'animate-svg'

async function foo() {
  // blabla
  const path = document.getElementById('some-svg-path-element')
  // the animateSvg function esentially returns a promise
  // so you can await it if you use it in an async function
  await animateSvg(path, 1, false)
  // blablabla
}

The function animateSvg accepts 3 parameters:

• the SVGPathElement or SVGLineElement to animate
• the speed at which the animation should occur (pixels per millisecond)
• (optional) direction of the animation: true is for reverse animation, false is for normal