みかづきブログ その3

本ブログは更新を終了しました。通算140万ユーザーの方に観覧頂くことができました。長い間、ありがとうございました。

👆

引越し先はこちらです!

Web Audio API の基本の基 その3 (ChannelMergerをつかってL・Rから別の音を再生する)

今回は ChannelMerger をつかってL・Rから別の音を再生します。

f:id:kimizuka:20160701210031p:plain


この音( http://jsrun.it/assets/G/9/D/7/G9D75.mp3 )とこの音( http://jsrun.it/assets/W/Z/8/F/WZ8Fo.mp3 ) をLRから出力してみましょう。

JavaScript

"use strict";

var audioCtx = new AudioContext(),
    merger   = audioCtx.createChannelMerger(2); // チャンネル数;

audioCtx.destination.channelCount = 2;
merger.connect(audioCtx.destination);

play("http://jsrun.it/assets/G/9/D/7/G9D75.mp3", 0);
play("http://jsrun.it/assets/W/Z/8/F/WZ8Fo.mp3", 1);

function play(path, channel) {
  var request = new XMLHttpRequest();

  request.open("GET", path, true);
  request.responseType = "arraybuffer";

  request.onload = function() {
    audioCtx.decodeAudioData(request.response, function(evt) {
      var source = audioCtx.createBufferSource();

      source.buffer = evt;
      source.loop   = true;

      source.connect(merger, 0, channel);
      source.start();
    });
  };

  request.send();
}

厳密に同時に再生していないのでちょっとずれるかもしれません。
あと、前回もなんですけどきれいなループになっていないのが気になります。(GarageBandの書き出しがうまくいきませんでした)

DEMO