Tone.js

Tone.jsとは?

Tone.jsは、Webオーディオアプリケーションを開発するためのJavaScriptライブラリです。

  • Tone.jsを使用すると
    • サンプル再生
    • 音声合成
    • 音楽シーケンシング
    • エフェクトの追加
      • ・・・など、様々なWebオーディオタスクを簡単に実現できる

Tone.jsは、オーディオコンテキストとWeb Audio APIを基盤としています。

オーディオコンテキストとは?

オーディオコンテキストは、Web Audio APIの中心的な要素であり、オーディオグラフを作成して、音声の生成、処理、合成を行います。

Tone.jsは、オーディオグラフを作成する際に便利なクラスやメソッドを提供しています。

  • オーディオコンテキスト
    • Web Audio APIの中心的な要素
      • オーディオグラフを作成して、音声の生成、処理、合成を行う
  • Tone.jsは
    • オーディオグラフを作成する際に便利なクラスやメソッドを提供している

たとえば、Tone.jsを使用すると、オシレーター(サイン波、矩形波など)、フィルター、エンベロープ、シーケンサー、エフェクト(リバーブ、ディレイなど)などを簡単に作成できます。

  • Tone.jsで
    • オシレーター(サイン波、矩形波など)
    • フィルター
    • エンベロープ
    • シーケンサー
    • エフェクト(リバーブ、ディレイなど)
      • ・・・などが簡単に作成できる

また、Tone.jsには、Web MIDI APIとの統合も含まれています。

MIDI

これにより、MIDIキーボードやMIDIコントローラーからの入力をTone.jsアプリケーションで処理することができます。

Tone.jsを使用する場合、MIDIデバイスからの入力を取得するためには、Tone.Midiオブジェクトを使用します。

MIDIメッセージを受信するには、Tone.MidiオブジェクトのaddListenerメソッドを使用して、コールバック関数を登録します。

登録されたコールバック関数は、MIDIメッセージを受信するたびに呼び出されます。

以下は、MIDIキーボードからの入力を受け取るTone.jsのサンプルコードです。

// MIDI入力を受け取るコールバック関数
function onMidiMessage(event) {
  // MIDIメッセージを解析する
  let data = event.data;
  let cmd = data[0] >> 4;
  let channel = data[0] & 0xf;
  let note = data[1];
  let velocity = data[2];

  // ノートオンメッセージの場合
  if (cmd === 0x9) {
    // MIDIノート番号から周波数を計算する
    let frequency = Tone.Midi(note).toFrequency();

    // オシレーターを作成して再生する
    let oscillator = new Tone.Oscillator(frequency, "sine").toDestination().start();
  }
}

// MIDIデバイスからの入力を取得する
if (navigator.requestMIDIAccess) {
  navigator.requestMIDIAccess().then(function(midiAccess) {
    let inputs = midiAccess.inputs.values();
    for (let input = inputs.next(); input && !input.done; input = inputs.next()) {
      // MIDI入力にコールバック関数を登録する
      input.value.onmidimessage = onMidiMessage;
    }
  });
}

この例では、MIDIキーボードからノートオンメッセージを受け取ると、そのノート番号に対応する周波数のオシレーターを作成して再生します。

Tone.Midiオブジェクトを使用することで、MIDIノート番号を周波数に変換することができます。

以上のように、Tone.jsを使用することで、Webブラウザ上でMIDIデバイスからの入力を簡単に処理することができます。


Tone.jsは、GitHubでオープンソースとして公開されており、ドキュメントやデモも豊富に用意されています。

Webオーディオアプリケーションを開発する際には、Tone.jsが役立つ場合が多いでしょう。

タイトルとURLをコピーしました