6

私は Web オーディオ API 仕様を見ています。パン ノードは 3 つの値を使用して、サウンドの 3D スペクトルを作成します。基本的な 2D の「同等のパワー」パナーを作成するために、プログラマーはこれをスケーリングするために定型プログラミングを行う必要があるのでしょうか...それとも、考えすぎてもっと簡単な方法があるのでしょうか。

編集

現在、stereoPanner ノードが導入されています。

4

3 に答える 3

9

2D パンを実現するためのさらに簡単な (定型的ではない?) 方法を次に示します。

(完全なコードはこちら)

<input type="range" name="pan" id="pan" min="-1" max="1" step="any" />
<script>
var panner = context.createPanner();
panner.panningModel = 'equalpower';

function pan(event) {
    var x = this.valueAsNumber,
        y = 0,
        z = 1 - Math.abs(x);
    panner.setPosition(x,y,z);
}

document.getElementById('pan').addEventListener(pan);
</script>
于 2013-12-31T02:12:40.530 に答える
7

setPosition() の最初の引数のみを変更し、他の引数をゼロのままにすることで、パンニング効果を得ることができます。

<!DOCTYPE html>
<html>
<head>
<script>
var c = new webkitAudioContext();
var s = c.createBufferSource();
var g = c.createGainNode();
var p = c.createPanner();
s.connect(g);
g.connect(p);   
p.connect(c.destination);

function play(e) {
  var fr = new FileReader();
  var file = document.getElementById("file").files[0];
  fr.onload = function(e) {
    c.decodeAudioData(e.target.result, 
      function (buf) {
        s.buffer = buf;
        g.gain.value = 0.5;
        s.noteOn(0)
      },
      function () {
        console.error('decodeAudioData failed.');
      }
    );
  };
  fr.readAsArrayBuffer(file);
}

function pan(range) {
  var x = Math.sin(range.value * (Math.PI / 180));
  p.setPosition(x, 0, 0);
}
</script>
</head>
<body>
  Choose your MP3 file:<br>
  <input type="file" id="file" name="file" /><br>
  <input type="submit" id="go" onclick="play()" value="Play" /><br>
  L<input type="range" min="-45" max="45" value="0" onchange="pan(this);">R
</body>
</html>

ただし、自然なパン効果を得るには、3 番目の引数も指定する必要があります。

function pan(range) {
  var xDeg = parseInt(range.value);
  var zDeg = xDeg + 90;
  if (zDeg > 90) {
    zDeg = 180 - zDeg;
  }
  var x = Math.sin(xDeg * (Math.PI / 180));
  var z = Math.sin(zDeg * (Math.PI / 180));
  p.setPosition(x, 0, z);
}
于 2013-01-19T08:39:37.247 に答える
1

パナー ノードのデフォルトは、ステレオ畳み込みエンジンであり、3D サウンド用に設計された「HRTF」(Head Related Transfer Function) です。

基本的なパン機能を持ち、リソースの使用量を抑えるには、panningModel 属性を「equalpower」に設定する必要があります。

var panner = context.createPanner();
panner.panningModel = "equalpower";
panner.setPosition(1,0,0);

詳細については、ドキュメントを確認してください。

于 2014-01-19T13:35:51.780 に答える