React-SiriWave

Install

npm

npm install --save react-siriwave

yarn

yarn add react-siriwave

Usage

import Siriwave from 'react-siriwave';

// ...
<Siriwave />
// ...

Demo

Constructor options

| Key | Type | Description | Default | Required | | ---------- | ------------- | ---------------------------------------------------------------------- | ---------- | -------- | | theme | "ios", "ios9" | The curve style of the wave. | "ios" | no | | ratio | Number | Ratio of the display to use. Calculated by default. | calculated | no | | speed | Number | The speed of the animation. | 0.2 | no | | amplitude | Number | The amplitude of the complete wave-form. | 1 | no | | frequency | Number | The frequency of the complete wave-form. Only available in style "ios" | 6 | no | | color | String | Color of the wave. Only available in style "ios" | "#fff" | no | | cover | Bool | The canvas covers the entire width or height of the container | false | no | | autostart | Bool | Decide wether start the animation on boot. | true | no | | pixelDepth | Number | Number of step (in pixels) used when drawed on canvas. | 0.02 | no | | lerpSpeed | Number | Lerp speed to interpolate properties. | 0.01 | no | | curveDefinition | ICurveDefinition[] | Override definition of the curves | null | no | | onInit | (siriwave: Siriwave) => void | Callback function to get the siriwave instance | null | no |