Package detail

es6tween-plugin-draw

dalisoft11MIT0.0.5

SVG Shape Stroke-Line Drawing, Motion-path and Along-path Plugin for es6-tween

stroke, line, motion, along, direct string, draw, drawing, animation, es6-tween, performant, easy, interpolation, svg, attributes, dom

readme

es6-tween-plugin-draw

Usage

import { Tween } from 'es6-tween';
import 'es6-tween-plugin-draw';

let tween = new Tween(document.querySelector('#myCircleSVG'), {draw:'0 100%'}).to({draw:'50% 50%'}, 2000).start();

Motion path / Along path

import { Tween } from 'es6-tween';
import 'es6-tween-plugin-draw';

let tween = new Tween(document.querySelector('#myCircleSVG'), {/* any yours */}).to({alongPath:'#myPathShape'}, 2000).start(); // moves #myCircleSVG along #myPathShape

or

import { Tween } from 'es6-tween';
import 'es6-tween-plugin-draw';

let tween = new Tween(document.querySelector('#myPathShape'), {/* any yours */}).to({motionPath:'#myCircleSVG'}, 2000).start(); // moves #myCircleSVG along #myPathShape