React Vivus
This react component allows you to make drawing animation on SVG.
This component makes use of vivus.js plugin.
Installation
To install this component, run yarn add react-vivus
or npm install react-vivus --save
, Don't forget to install vivus by running yarn add vivus
or npm install vivus --save
.
Usage
To use the component, in your react application just do
;;; const MyComponent = <ReactVivus id="foo" option= file: svg animTimingFunction: 'EASE' type: 'oneByOne' onReady: consolelog style= height: '100px' width: '100px' callback=consolelog />;;
Click here to download the sample svg
You can view all the different options to create a custom animation to draw your SVG in whatever way you like here https://github.com/maxwellito/vivus#option-list