javascript - P5.js 中的步进音序器时序错误

Question

我正在使用 Tone.js 中的步进音序器链接：https ://glitch.com/edit/#!/sustaining-lunar-chard一切运行良好，但我似乎无法弄清楚为什么时间已关闭。如果您单击第一列，第一个音符触发正常，但在单击几个音符后，它似乎变得异常。

触发音频的相关代码：

// Here is where we actually play the audio
function onSequenceStep(time, column) {
  // We build up a list of notes, which will equal
  // the numRows. This gets passed into our PolySynth
  let notesToPlay = [];

  // console.log(column) // output the current column
  
  // Go through each row
  data.forEach((row, rowIndex) => {
    // See if the note is "on"
    const isOn = row[column] == 1;
    // If its on, add it to the list of notes to play
    if (isOn) {
      const note = notes[rowIndex];
      notesToPlay.push(note);
    }
  });

  // Trigger a note
  const velocity = random(0.5, 1);
  synth.triggerAttackRelease(notesToPlay, noteInterval, time, velocity);
  Tone.Draw.schedule(function() {
    currentColumn = column;
  }, time);
}

// Code to assist in conversion of shapesList data into format of data array
function splitArrayIntoChunksOfLen(arr, len) {
  var chunks = [], i = 0, n = arr.length;
  while (i < n) {
    chunks.push(arr.slice(i, i += len));
  }
  return chunks;
}

function inputSequencerData() {
  /*
    1. Get shapesList active data into same format as data array ✅
    2. Set value of data array to array of shapesList active data ✅
  */
  // console.log(data);
  let shapesListSplit = splitArrayIntoChunksOfLen(shapesList, 16);

  for (let i = 0; i < shapesListSplit.length; i++) {
    // console.log(shapesListSplit[i]); // Log all rows of values

    // Loop over each shapesListSplit[i] and check if shapes are active
    for (let j = 0; j < shapesListSplit[i].length; j++) {
      if (shapesListSplit[i][j].active == true) {
        data[i][j] = 1;
      } else {
        data[i][j] = 0;
      }
    }
  }
}

这是在 draw() 函数中触发的音频代码。

  // Clear canvas and redraw
  for (let i = 0; i < shapesList.length; i++) {
    shapesList[i].show();
    inputSequencerData();
  }

它基于以下示例：https ://glitch.com/edit/#!/tone-example-sequencer?path=sketch.js%3A223%3A27

有谁知道这里可能会发生什么？任何帮助将非常感激

标签： javascripthtml5-canvasp5.jsweb-audio-apitonejs