2014年7月6日日曜日

Web Audio APIとSOUND LAB

最近,Web Audio APIをちょっと触っています。
Web Audio APIは,文字通りWeb上でjavascriptを使って音声データを扱うための仕組みで,ソース,ゲイン,出力など,さまざまなノードをグラフに接続していくことで,簡単に音声を操作することができます。
参考資料としては,O'REILLYの「Web Audio API」。(電子書籍のみです)

驚いたのが,発信器やFFTをしてくれるノードまで用意されていること。
さすがに,javascriptで生の波形データをFFTするのは厳しいと思っていたのですが,API側でそこまでやってくれるのであれば,(おそらくそこはネイティブで動いているので)パフォーマンス的な不安はありません。また,今のところChrome限定みたいですが,マイク入力を扱うこともできます。
あと,HTML + javascriptということで,iOSやAndroid(上のChorme)でも動作します。(※Androidに関しては,結構端末依存のようで,XperiaやGalaxyはかなり最近の機種でもダメっぽいのが残念ですが)

というわけで,Web上で音声の周波数解析ができるものを作ってみました。

とりあえず,PC(Windows / Mac)上のGoogle Chromeもしくは,Web Audio APIに対応したAndroid端末上のChromeブラウザで見ることをお薦めします。
※Web Audio APIに対応していない端末でアクセスすると,「お使いのブラウザでは,Web Audio APIがサポートされていません。」というメッセージが表示されます。不明な場合は,とりあえずアクセスしてみてください。
※iOSは未確認です。とりあえず,Web Audio APIに対応していることは確認済ですが,マイク入力に対応しているかは不明です。

それにしても,Web(というかブラウザ)上でここまでできるというのは驚きです。

なお,この周波数解析の可視化部分のコードは,上記参考資料のサンプルコードほぼそのままです。