AudioContext.createWaveShaper()

AudioContext 接口的createWaveShaper()方法创建了 表示非线性失真的WaveShaperNode。该节点通常被用来给音频添加失真效果

语法

var audioCtx = new AudioContext();
var distortion = audioCtx.createWaveShaper();

返回

A WaveShaperNode.

例子

The following example shows basic usage of an AudioContext to create a wave shaper node. For applied examples/information, check out our Voice-change-O-matic demo (see app.js for relevant code).

下面的例子展示了AudioContext创建一个波形整形器节点的基本用法。有关应用示例/信息,请查看我们的oice-change-O-matic demo演示(有关代码,请参阅app.js)。

:实现失真曲线并不是简单的事情,你可能需要到处找资料来找到这样的算法。我们在Stack Overflow上找到了以下的失真曲线代码

var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var distortion = audioCtx.createWaveShaper();

  ...

function makeDistortionCurve(amount) {
  var k = typeof amount === 'number' ? amount : 50,
    n_samples = 44100,
    curve = new Float32Array(n_samples),
    deg = Math.PI / 180,
    i = 0,
    x;
  for ( ; i < n_samples; ++i ) {
    x = i * 2 / n_samples - 1;
    curve[i] = ( 3 + k ) * x * 20 * deg / ( Math.PI + k * Math.abs(x) );
  }
  return curve;
};

  ...

distortion.curve = makeDistortionCurve(400);
distortion.oversample = '4x';

规范

Specification Status Comment
Web Audio API
createWaveShaper()
Working Draft  

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)
Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 10.0webkit (en-US) (Yes) 25.0 (25.0)  未实现 15.0webkit (en-US)
22 (unprefixed)
6.0webkit (en-US)
Feature Android Edge Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support ? (Yes) 26.0 1.2 ? ? ? 33.0

See also