Web MIDI API
実験室

2019.03.23
Web MIDI APIはGoogle Chromeで動作します。
Web MIDI API動作環境チェック
Application List(Guithub)

(2019.03.23) Drum Machine のWeb Audio APIを外から使えるように書いてみました。
iPhoneでも音、出ます。タッチするときには音量に注意して下さい。 ⇒ リンク
(2019.1.20)Piano Machine にChord Mode を追加しました。 ⇒ リンク
説明、プログラムはこちらです。⇒ リンク
(2019.01.05) getUserMediaのステレオ対応ができていませんでしたので修正しました。 ⇒ リンク
(2019.01.04)Send and Receiveにスクロールを修正しました。STOP ボタンをつけました。 ⇒ リンク
(2018.12.01)loopMIDI ⇒ リンク
(2018.11.24)iphone とPCをBluetooth MIDI でつなぐ(作業中) ⇒ リンク
(2018.10.27)iphone に楽器をつなぐ((2018.11.03) rtpMIDIの接続更新中) ⇒ リンク



MIDI Application


(2017.09.10) MIDI モニター ⇒ リンク
MidiMonitor
説明、プログラムはこちらです。⇒ リンク

(2017.11.19) MIDI の送受信アプリです。System Exclusive の送受信ができます ⇒ リンク
SendReceive
説明、プログラムはこちらです。⇒ リンク

(2018.02.08) MIDI パッチベイ ⇒ リンク
MIDI-patchbay
説明、プログラムはこちらです。⇒ リンク

(2018.05.06) SMF プレーヤー ⇒ リンク
SmfPlayer
説明、プログラムはこちらです。⇒ リンク




AUDIO Application

(2017.11.19) Piano Machine ⇒ リンク
PianoMachine
説明、プログラムはこちらです。⇒ リンク

(2017.05.25) ドラムマシン パソコンのキーボードを叩くと音が出ます ⇒ リンク
DrumMachine
説明、プログラムはこちらです。⇒ リンク

(2018.06.02) Pop Looper ⇒ リンク
Pop-Looper
説明、プログラムはこちらです。⇒ リンク

(2017.10.27) ドラムマシン ステップシーケンサー ⇒ リンク
DrumSequencer
説明、プログラムはこちらです。⇒ リンク





   W3CのAudio Working Group にて策定されているWeb MIDI APIを使って実験してみます。実験の目的は、パソコンに接続された、電子楽器をWeb ブラウザから鳴らすことです。また電子楽器やゲームパッドからWeb Audio APIを使って作られた、Web ブラウザの音源を鳴らしてみたいと思っています。基本的にJavaScriptが良くわかっていないので、その勉強も兼ねています。他にもMIDIや音、音楽をWeb で使うためのいろいろな実験をしています。

   ブラウザはChromeを使って下さい。それ以外はチェックしていません。まずは、みなさんのブラウザがWeb MIDI APIに対応しているかどうか、確認してみてください。以下のページを開いて、MIDI ready!と表示されれば、みなさんの環境はWeb MIDI APIに対応しています。

動作確認 ⇒テスト
(2018.09.25)Web MIDI API 起動用javascriptプログラム ⇒ リンク


リファレンス


   MIDIモニター

   USB MIDI キーボードをPCにつないで、鍵盤を押した時にどのようなMIDIデータがキーボードから出力されるのかをモニターしてみます。
   MIDI モニター ⇒リンク
   (2016.9.23)  MIDI のデータ(数字)をかっこよく表示する。  ⇒ リンク
   (2016.9.25)  コントロールチェンジをグラフで表示する。  ⇒ リンク



   MIDI鍵盤を使ったアプリケーション例

   (2015.5.5)     MIDI モニターを利用したアプリケーションです。鍵盤を押すと、URLが開きます。
   drawImageを使って、canvasに絵を表示するように変更しました。 ⇒リンク





   MIDI Patchbay

   (2015.8.29) MIDI Patchbayは複数のMIDI入力装置と、複数のMIDI出力装置がPCに接続されているとき、どの入力装置からのMIDIをどの出力装置に出力するかを選択する機能を持っています。
   MIDI Patchbay ⇒  リンク
   (2015.12.05) MIDI Patchbayの使い方をこちらへ書いていこうと思います。⇒  リンク



   System Exclusiveの実験

   (2015/3/23) System Exclusiveを送信実験できるように改造。System Exclusiveは、httpsのサイトでないと動作しない。 
   SysEX モニター  ⇒リンク



   Web Audio API とソフトシンセ

   (2015/6/6) Web MIDI APIでMIDI Note On を受信すると、Web Audio API で鋸波を発生します。Note Off を受信すると音が止まります。
   簡単なソフトシンセ  ⇒リンク
   (2016.11.08)  パーカッション・パッド  パッドをクリックすると音が鳴ります。
   バグ修正しました ⇒リンク
   (2017.03.31)  Ground Piano Example 製作中⇒ リンク



   SMF プレーヤー

   (2015/7/10)  簡単なSMF Playerを作ってみた(SysEx対応済) ⇒リンク
   (2015.7.6)  YAMAHAのデータショップでSMFデータを購入して、eVY1で鳴らしてみた。 ⇒リンク



   ステップシーケンサー

   (2014.8.13)  ステップシーケンサーを作ってみた。その1  ⇒リンク
   (2014/11/01)  ステップシーケンサーを作ってみた。その2  ⇒リンク



   アプリケーション/iPhoneとの接続

   (2014/11/01)  ソフトシンセサイザーをつないでみた(解説)。  ⇒リンク
   (2014/11/02)  ソフトシンセサイザーをつないでみた、のビデオをつくってみた  ⇒リンク
   (2018/10/27)  Windows10 Home 64bitで動作確認しました。
       rtpMIDを使って、iPhoneとPCをMIDIでつないで、iPhoneをコントローラにしてみます。→リンク
   (2014.7.13)  iPhoneアプリ Midi Monitor ver2.0を使ってみる。  iPhoneをコントローラにしてみます。→リンク



   Web Audio API

   (2014/10/15)  Web Audio APIを使ってみました ⇒リンク
   (2015.8.27)  Web Audio APIのAnalizerについて調べてみた (追記)  ⇒ リンク
   (2015.9.23)  wave 波形を表示する ⇒ リンク



   getUserMedia

   (2016.1.09)  getUserMedia で音をマイクの音を、スピーカから再生
   (2014.9.06)  getUserMediaがhttpsでないど動作しない  ⇒リンク
   (2015.10.10)  getUserMedia でビデオを取り込む 
   (2016.1.09)  getUserMediaがhttpsでないど動作しない  ⇒リンク



   その他の実験

   (2018.9.26)  ブラウザーを判定したい  ⇒リンク
   (2015.2.28)  Fileにパラメータを保存  ⇒リンク
   (2015.4.12)  GamePadAPIの実験  ⇒リンク
   (2015.8.9)  Canvas をcssでサイズを変更した時、widthとclientWidthの関係で嵌ったので、記録しておく   ⇒ リンク
   (2016.6.5)  iPhoneのブラウザでjavascriptでタッチイベントを掴む方法を調べてみました   ⇒ リンク
   (2016.10.16)  Youtube IFrame Player API 勉強中  ⇒ リンク
   (2018.08.25)  複数のYoutube IDを重ねて表示  ⇒ リンク     ⇒ 使い方
   (2017.3.26)  Sound Cloud API 勉強中  ⇒ リンク
   (2017.08.16)  AWS IoTを試す -1/3  ⇒ リンク
   (2018.04.14)  AWS DynamoDBを試す -1/3  ⇒ リンク