BaseAudioContext: createStereoPanner() メソッド

createStereoPanner()

const audioCtx = new AudioContext();
const myAudio = document.querySelector("audio");
const panControl = document.querySelector(".panning-control");
const panValue = document.querySelector(".panning-value");
// MediaElementAudioSourceNode を生成し、
// そこに HTMLMediaElementを 入れる
const source = audioCtx.createMediaElementSource(myAudio);
// ステレオパンナーを生成する
const panNode = audioCtx.createStereoPanner();
// イベントハンドラー関数で、スライダーが動いたとき
// 左右のパンの値を左右する
panControl.oninput = () => {
  panNode.pan.setValueAtTime(panControl.value, audioCtx.currentTime);
  panValue.innerHTML = panControl.value;
};
// MediaElementAudioSourceNode を panNode に、 panNode を
// 出力先に接続し、音楽を再生してコントロールでパンを調整
// できるようにします。
source.connect(panNode);
panNode.connect(audioCtx.destination);