【実践したいこと】 細かい事までわかろうとするとキリがないのでそこまで深掘りしないとしても、async/await をよくわからないまま何となく使う状況からは脱却したい。 ここでは async/await についてすべて解説しているのではなく、自分が実際に async/awa…
【実践したいこと】 何を：console.log などが実行されても、ブラウザのコンソールに何も表示させないようにしたい。 どこで：Webページ上 何のために使うのかはわからないが、実例を見たのでメモしておく。 【ソース】 ▾main.js console.log = function() {…
【実践したいこと】 何を：ユーザが使っているブラウザが Web Audio API に対応しているかチェックし、対応していなければ警告文をコンソールに表示させるまで どこで：Webページ上 【ソース】 ▾index.html <html> <body> <script src="main.js"></script> </body> </html> ▾main.js try { window.AudioContext = wind…
【実践したいこと】 何を：ある範囲(たとえば0～7)の値を、別の範囲(たとえば-1～1)の値に置き換えたい。 Pure DataのスライダーやMax/MSPのscaleオブジェクトのような操作が欲しかった。 【ソース】 ▾main.js function mapping (value, minIn, maxIn, minOu…
Webページ上で音声処理 (サウンドエンジニアリング) をするには、Web Audio APIというJavaScript APIを利用することになる。 この記事では、Web Audio APIを使ったサウンドエンジニアリングを行うにあたって知っておくべき仕組みや用語をまとめておきたい。 …
【実践したいこと】 何を：画像または映像を読み込み、その一部分だけを切り取る(トリミングする)まで (今回は、Webカメラから取得した映像(以下の記事を参照)を使う) 。 どこで：Webページ上 audiovisualcoding.hatenablog.com 【前提知識】 HTML属性とDOM…
【実践したいこと】 何を：ユーザのWebカメラやマイクから、映像・音声(今回は映像のみ)を取得して再生するまで どこで：Webページ上 【前提知識】 HTML属性とDOMプロパティ Promise 【ソース】 ▾index.html <html> <body> <div id="videoWrap"></div> <script src="main.js"></script> </body> </html> ▾main.js // 1-i HTMLVideoElementオブジ…
