AudioContext如何按顺序播放音符

时间:2017-09-12 12:03:58

标签: javascript sequence audiocontext

我已按照此tutorial提出该代码:

context = new AudioContext();
play(frequency) {
    const o = this.context.createOscillator();
    const g = this.context.createGain();
    o.connect(g);
    g.connect(this.context.destination);
    g.gain.exponentialRampToValueAtTime(
      0.00001, this.context.currentTime + 1
    );
    o.frequency.value = frequency;
    o.start(0);
  }

通过传递值11752794等,我可以在tutorial表格中播放任何音符

我决定创建一个音符数组,并在循环中调用我的play函数,它只是不起作用,因为所有音符只是一次播放而没有延迟。

你将如何播放序列中的音符数组?

我也在查看article,但仍然无法弄清楚我如何调整上面的代码。

2 个答案:

答案 0 :(得分:6)

您可以在播放功能中使用附加参数 time 按顺序播放音符。这样您就可以控制序列中每个音符的开始时间和结束时间。

  var context = new AudioContext();

  var notes = [1175, 2794];
  var duration = 1;
  var interval = 2;

  function play(frequency, time) {
    var o = context.createOscillator();
    var g = context.createGain();
    o.connect(g);
    g.connect(context.destination);
    g.gain.exponentialRampToValueAtTime(
      0.00001, context.currentTime + duration + time
    );
    o.frequency.value = frequency;
    o.start(time);
  }

  for (var i = 0; i < notes.length; i++) {
    play(notes[i], i * interval);
  }

但是,如果您需要更精确/更健壮的调度程序,您可以使用像WAAClock.js这样的库,或者从Chris Wilson metronome中获取灵感来构建您自己的调度程序。

答案 1 :(得分:0)

这是因为您正在执行的操作在JavaScript中是非阻塞的。在这些之间强制延迟的最直接的方法是使用setInterval和setTimeout。我找到了在this article on using AudioContext中使用它们的示例。

setInterval on MDN setTimeout on MDN

不同之处在于setTimeout在延迟后执行一次,而setInterval会反复执行,直到您告诉它停止为止。