特定の周波数の音を出力する
続いて、特定の周波数の音を出力してみましょう。Audio Data APIでは以下のような手順で特定の周波数の音を出力できます。
まず、new Audio()としてオーディオオブジェクトを作成します。このとき、オーディオファイルのURLは指定しません。次に、出力する音のチャンネル数とサンプリングレートをmozSetup()メソッドに指定します。たとえばチャンネル数が「2」でサンプリングレートが「44.1kHz」であれば mozSetup(2, 44100) と指定します。
チャンネルとサンプリングレートの設定が終わったら、配列にオーディオデータを作成します。new Array()として配列を生成した場合、どのような型(文字、数値)になるか分かりません。そこで必ず32ビット浮動小数値の要素を生成する専用のFloat32Array配列オブジェクトを使います。配列のサイズは出力する音の秒数(ミリ秒)です。1秒の長さの音であれば1000ミリ秒ですので、new Float32Array(1000)と指定します。
次に、配列に音のデータを入れます。基本的な正弦波(サイン波)であればMath.sin()を使って生成します。Math.sin()に指定する引数はラジアン表記です。ラジアンは360度であれば2πになりますので、JavaScriptでは2 * Math.PIとなります。この2πに出力する周波数を乗算すると音の振動数となり、サンプリングレートで除算した値を変数に入れます。あとは、配列の要素数(=秒数)だけMath.sin()を使って正弦波(サイン波)の値を入れていきます。音量を調整したい場合は2 * Math.sin(~)のようにして振幅を計算します。
作成した配列データをmozWriteAudio()メソッドの引数に指定します。作成した音のデータはこれまでと同様にplay()メソッドを使って出力します。
実際のプログラムはサンプル5です。ボタンをクリックすると440Hzの音(ラの音階)が鳴ります。サンプル6はボタンをクリックするとさまざまな音を再生できます。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>指定した周波数を出力</title>
</head>
<body>
<h1>指定した周波数を出力</h1>
<form>
<input type="button" value="440Hzの音を出力" onclick="startAudio()" />
</form>
<script type="text/javascript">
function startAudio(){
var freq = 440; // 440Hz
var sampleRate = 44100; // 44.1kHz
var audio = new Audio();
audio.mozSetup(1, sampleRate); // 1ch, 44kHz
var bufferSize = sampleRate * 1; // 1000ms
var data = new Float32Array(bufferSize);
var k = 2* Math.PI * freq / sampleRate;
for(var i=0; i<data.length; i++){
data[i] = Math.sin(k * i);
}
audio.mozWriteAudio(data);
audio.play();
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>指定した周波数を出力2</title>
</head>
<body>
<h1>指定した周波数を出力2</h1>
<form>
<input type="button" value="440Hz" onclick="startAudio(440)" /><br />
<input type="button" value="494Hz" onclick="startAudio(494)" /><br />
<input type="button" value="554Hz" onclick="startAudio(554)" /><br />
<input type="button" value="587Hz" onclick="startAudio(587)" /><br />
<input type="button" value="659Hz" onclick="startAudio(659)" /><br />
<input type="button" value="740Hz" onclick="startAudio(740)" /><br />
<input type="button" value="831Hz" onclick="startAudio(831)" /><br />
<input type="button" value="880Hz" onclick="startAudio(880)" /><br />
</form>
<script type="text/javascript">
function startAudio(freq){
var sampleRate = 44100; // 44.1kHz
var audio = new Audio();
audio.mozSetup(1, sampleRate); // 1ch, 44kHz
var bufferSize = sampleRate * 1; // 1000ms
var data = new Float32Array(bufferSize);
var k = 2* Math.PI * freq / sampleRate;
for(var i=0; i<data.length; i++){
data[i] = Math.sin(k * i);
}
audio.mozWriteAudio(data);
audio.play();
}
</script>
</body>
</html>