2.1.0 • Published 9 months ago

webgpu-waveform v2.1.0

Weekly downloads
-
License
-
Repository
github
Last release
9 months ago

webgpu-waveform

Render waveforms to <canvas /> using WebGPU

Examples

Visit https://aykev.dev/webgpu-waveform/ for examples

Installation

This package is distributed for both usage with ESM and UMD. It includes TypeScript definition files too. Install from the npm registry:

npm i webgpu-waveform

For usage with React, check out the webgpu-waveform-react package.

Usage

The class GPUWaveformRenderer is initialized using the static method .create(...). It has the following definition:

static async create(
  canvas: HTMLCanvasElement,
  channelData: Float32Array
): GPUWaveformRenderer

It takes in the following arguments:

  • canvas: HTMLCanvasElement — the canvas element to render to
  • channelData: Float32Array — the array of PCM samples to render

Example:

async function example(canvas, audioBuffer) {
  const channelData = audioBuffer.getChannelData(0);
  const renderer = await GPUWaveformRenderer.create(canvas, channelData);

  renderer?.render(800, 0, canvas.width, canvas.height);
}
2.1.0

9 months ago

2.0.2

9 months ago

2.0.1

10 months ago

2.0.0

11 months ago

1.1.0

1 year ago

1.0.0

1 year ago