Author: | hato-taka |
---|---|
Views Total: | 1,530 views |
Official Page: | Go to website |
Last Update: | December 29, 2021 |
License: | MIT |
Preview:

Description:
waving.js is a tiny yet customizable JavaScript library for drawing animated waves on an HTML5 canvas element.
How to use it:
1. Download and import the waving.js library.
<script src="waving.js"></script>
2. Generate default animated waves on your page.
new Wave();
3. Customize the waves by overriding the default parameters as listed below:
new Wave({ unit: 100, // wave size info: { infoSeconds: 0, infoTime: 0, }, animationFrame: .014, timeoutSecond: 35 el: document.createElement('canvas'), colorList: ['#0ff', '#ff0', '#f00', '#00f', '#f0f'] , opacity: [0.8, 0.5, 0.3, 0.2, 0.8] , zoom: [3, 4, 1.6, 3, 2], startPosition: [0, 0, 0, 100, 0], lineWidth: 1 , xAxis: Math.floor (this.canvas.height / 2), yAxis: , stroke: true, fill: false, canvasWidth: document.documentElement.clientWidth, canvasHeight: 200, }),