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 ```javascript import React from 'react'; import ReactVivus from 'react-vivus'; import svg from './example.svg'; const MyComponent = () => ( id="foo"

option={{

file: svg,

animTimingFunction: 'EASE',

type: 'oneByOne',

onReady: console.log

}}

style={{ height: '100px', width: '100px' }}

callback={console.log}

/> ); export default MyComponent; ``` 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