(原始内容存档于2018-09-21). Wave.js

Javascript的音频可视化器库.

安装

用 CDN 安装

<script src="https://cdn.jsdelivr.net/gh/foobar404/wave.js/dist/bundle.js"></script>

或国家预防机制

npm i @foobar404/wave

设置

如果你使用国家预防机制:

import {Wave} from "@foobar404/wave";

使用量

let audioElement = document.querySelector("#audioElmId");
let canvasElement = document.querySelector("#canvasElmId");
let wave = new Wave(audioElement, canvasElement);

// Simple example: add an animation
wave.addAnimation(new wave.animations.Wave());

// Intermediate example: add an animation with options
wave.addAnimation(new wave.animations.Wave({
    lineWidth: 10,
    lineColor: "red",
    count: 20
}));

// Expert example: add multiple animations with options
wave.addAnimation(new wave.animations.Square({
    count: 50,
    diamater: 300
}));

wave.addAnimation(new wave.animations.Glob({
    fillColor: {gradient: ["red","blue","green"], rotate: 45},
    lineWidth: 10,
    lineColor: "#fff"
}));

// The animations will start playing when the provided audio element is played

// 'wave.animations' is an object with all possible animations on it.

// Each animation is a class, so you have to new-up each animation when passed to 'addAnimation'

捐款

参与其中! 看看这个 贡献指南 如何开始.

许可证

麻省理工学院