shingoushori's dialy

音信号処理を専ら研究していた元博士後期課程の学生によるメモ

JZZ.js で 特定 ch を削除

MIDIファイルをいじるWebコンテンツ on はてなブログ 〜 の検討
今回は、jazz-softさん作の、 JZZ.jsで特定チャンネルの情報を削除してみました.

チェックボックスを off にした ch の情報を削除して出力します。

 

Drop files here

                                                                                     

 

JZZ.js さんは Helpers としてノートonとかチャンネルとかを解釈する関数があるらしい。
しかし今回はMIDIメッセージ1つ分のオブジェクト JZZ.MIDI の数字から自前で解釈。
いや、getChannel() 関数を使った方がいい気がする。

地味に削除するチャンネルを指定するチェックボックスの方が面倒だった気がする。
デフォルトをonにするためにsetAttribute("checked", "checked")するとか、地味にトリッキー。

<参考文献>

https://developer.mozilla.org/ja/docs/Web/HTML/Element/Input/checkbox

【HTML】出来るだけ押しやすいチェックボックスを作る|リスティング広告の運用代行ならカルテットコミュニケーションズ

 

A-Frame でランダムに箱を配置してみるテスト

xRしたい! VTuberしたい! ということで、A-Frame

VTuberするのにアバターの必要性を感じなくなってきたので、A-Frame での基本形状の追加/削除をやってみました。

div a-frame

 

camera の向いている方向に box を置きます。同じ方向を向いたままで連打すると、壁ができていきます。
camera の向いている方向の取得で今回やっている方法が腑に落ちない。
camera の要素でなく、camera.parent から取得しています。
さらに、取得した回転行列(rotationオブジェクト)を box の回転行列に適用するにあたって radian から degree に変換しています 。
なんだそれ。

腑に落ちないながらも、単に箱や球を配置することはとりあえず簡単。

Simutrans の Pakset づくりへの準備

Simutrans(http://japanese.simutrans.com)は, 素晴らしい.
Pakset というので景観や機能、シナリオ?まで置き換えられます.

Pakセット - Simutrans日本語化・解説

Simutrans - Paksets

そんな Pakset を自作すべく、準備。

<makeobj の仕様確認>

Simutrans Tikiwiki | en_doPak

Sizes form PAK16 up to PAK255 are supported. However, 
only the sizes PAK32, 64, 96, 128 are tested and in current use.

ほほぅ ... PAK16 まで出せるのは意外。
PAK255 までということは、Pak256 ではmakeobjの改造が為されているということ?FrontPage - Simutrans Ex Pak256 official website

 

<libpng>
libpngのインストールとC言語での使用方法・使用例 | だえうホームページ

アドインの画像のサイズを ImageMagick でやろうとしたものの、問題が色々。
ImageMagick - Convert, Edit, or Compose Bitmap Images

「さようなら ImageMagick」の考察 - Qiita

libpngを用いてリサイズアプリを自作することに。

 

Simutrans の Pakset の最小構成

Simutrans(http://japanese.simutrans.com)は, 素晴らしい.
Pakset というので景観や機能、シナリオ?まで置き換えられます.

Pakセット - Simutrans日本語化・解説

Simutrans - Paksets


有志がアドオンを乱開発なされているので、新作の告知だけ眺めていても楽しいです.

今回は、そんな拡大する Pakset の最小構成を調べてみました.
ちなみに、 Pakセット - Simutrans日本語化・解説 <- こちら曰く、"ground.Outside.pak" があるかが大事らしい.
調べた対象は pak64 , pak64.japan . 
Simutransのバージョンは 120.4.1 Nightly 2019年3月辺りベースの自作改造品.

色々削ったところ、これらがないとpakset読み込み中に足りないってエラーが出ました.

building.01_CITY.pak
cursor.Builder.pak
cursor.GeneralTools.pak
cursor.Marked.pak
good.None.pak
good.Passagiere.pak
good.Post.pak
ground.Basement.pak
ground.Borders.pak
ground.ClimateTexture.pak
ground.Fence.pak
ground.LightTexture.pak
ground.Marker.pak
ground.Outside.pak
ground.ShoreTrans.pak
ground.Slopes.pak
ground.SlopeTrans.pak
ground.Water.pak
menu.BarTools.pak
menu.DialogeTools.pak
menu.GeneralTools.pak
menu.SimpleTools.pak
misc.Construction.pak
misc.Sidewalk.pak
symbol.ColorOptions.pak
symbol.Electricity.pak
symbol.Flags.pak
symbol.InTown.pak
symbol.Logo.pak
symbol.Message.pak
symbol.MessageOptions.pak
symbol.NewWorld.pak
symbol.NewYear.pak
symbol.Passagiere.pak
symbol.Post.pak
symbol.Seasons.pak
symbol.Waren.pak
way.dirt_road.pak

全てがズバリこれらじゃないといけないわけでもないようです.
道路や役場は、それらが1つはないとダメらしい. 

A-Frame を埋め込んでみるテスト

xRしたい! VTuberしたい! ということで、A-Frame 。

まず、A-Frame を埋め込んでみるテスト。A-Frame も今 (2019/05) や0.9.0。ほう? 

div a-frame

 

 A-Frameのページにあるイントロダクションのサンプルを埋め込んでみた。簡単。

いいえ、A-Frameのサンプルコードをそのまま貼り付けても、微妙。
はてなブログのメニューやらタイトルやらを超えて、全面表示。
そこで div に埋め込むことに。A-Frame にも embedded なる指定が必要。 簡単。
How to embed an aframe scene into a div - Stack Overflow

WebAudioAPIあたりと繋いでみるつもり。

Web Audio API を使用した音声を埋もれさせない音信号混合法の簡易実装

Web Audio APIはてなブログに埋め込むテスト

Web Audio API を使用した 音声を埋もれさせない音信号混合法の簡易実装 です。

WAV+WAV or WAV+マイク を、WAVに書き出します。マイクはFirefoxのみ。

前回からの進展として、"音声を埋もれさせない音信号混合法" の簡易実装をやってみました。
スペクトルは ↓こちら↓ を元に作成しました。
Web Audio API 解説 - 12.アナライザーの使い方 | g200kg Music & Software
FFT点数は1024で、低い方から256ビン表示しています。
埋もれさせたくない音声をFile0側にセットしてください。File0とFile1のどちらかを空にしておくと、空にした側をマイクからとれます。ただしFirefoxのみ。

"音声を埋もれさせない音信号混合法" とは、音声とBGMを混ぜた時に音声が埋もれて聞こえなくなるのは残念なので、そうならないような調整を自動的にやってくれるミキサーがあると便利では?という提案、 およびそのアルゴリズムの提案などなどです。
発表題目として現れる最初の発表はこちら
今回のコンテンツとしては、Web Audio APIにあるNodeを使っての簡易実装です。
"音声を埋もれさせない音信号混合法"として提案されている内容では、上位概念の提案も兼ねられています。 それは、時間周波数平面同士の重ね合わせをゴリゴリ行う、リッチなミキサーの構成法です。
本ブログの当初は、そのリッチなミキサーの構成法のWeb Audio APIでの実現を検討してきました。 やはりパフォーマンスの面で問題がありました。
そこで今回、発想を変えました。"音声を埋めさせない音信号混合法"の名の下、リッチなミキサーの構成法を用いての知見から、Web Audio APIで実現できる程度の簡易実装で効果が出せるかを検討しました。 知見の出所はこちら

File0
File1

 mixing result :                   

 mixing source0 :                   
 mixing source1 :                   

 mixing result2 :                   

 

Analyser

SmoothingTimeConstant :
MinDecibels :
MaxDecibels :

 

mixed
audio0
audio1
result2

 

チェックボックス"spectrogram"と"source rec"は、それぞれスペクトログラムとFile1およびFile2のミキシング結果と同じ時区間での切り出しです。
再生時間が5分の楽曲をフルでミキシングしたところ、処理落ちと思われるガタガタが発生しました。このため、一部の機能にon/offをつけてみました。
この辺りはWeb Audio APIの弱点なのかなと、同一ブラウザで複数タブを開きまくれたりしますので。

なお、このコンテンツについては日本音響学会2019年春季研究発表会にて発表します。
処理の中身であるとか、レジュメで引き合いに出した一般的なミキシング手法であるマルチバンドダッカー、ミラードイコライゼーションなどについては、また別の記事で。
別記事に仕切り直しする理由としては、パフォーマンス面が主です。 レジュメを書いた時に組んだローカルホストでのコンテンツで、 6秒 程度のサンプルデータでやる分には、マルチバンドダッカー、ミラードイコライゼーションについても問題なく処理できました。
ところが、はてなブログに埋め込んで、普通にwebコンテンツとして動かしてみたところ、先述の通りパフォーマンス問題が発生しました。調子に乗って、5分の楽曲をフルでミキシングしたからかもしれませんが。
その上に、マルチバンドダッカー、ミラードイコライゼーションを載せるのは、あまり有用とも思えませんでした。
その前にJavaScriptとWebAudioAPIをもっとちゃんと勉強して、パフォーマンス改善に取り組みたいところ。その実、廃止が謳われているScriptNodeに頼っていますので、AudioWorklet移植が必要です。なんということだ。

Web Audio API で内蔵マイクで録音+ミキシングに、大事そうな周波数帯域推定を追加

Web Audio APIはてなブログに埋め込むテスト

WAV+WAV or WAV+マイク を、WAVに書き出します。マイクはFirefoxのみ。

前回からの進展として、スペクトログラムを加工しました。
スペクトルは ↓こちら↓ を元に作理ました。
Web Audio API 解説 - 12.アナライザーの使い方 | g200kg Music & Software
FFT点数は1024で、低い方から256ビン表示しています。
加工のポイントとして、大事そうな周波数帯域推定の結果を示しています。音声を想定。フォルマントをしっかり計算しないでも、複数の帯域を区切ってのセントロイド同士での平均音量の比較でも、それなりに特徴は捉えられるとの思いつきです。
上位2帯域は目立つ色、それ以外は目立ちにくい色にしています。
なお、表示するパワーについては周波数が高い帯域ほどゲタを履かせています。そうでもしないと1 kHzどころか、100 Hzより下のパワーばかりに判定が引っ張られます。

File0
File1

 mixing result :                   

 mixing source0 :                   
 mixing source1 :                   

 

Analyser

SmoothingTimeConstant :
MinDecibels :
MaxDecibels :

 

mixed
audio0
audio1

 

うまくいっているのかといえば、劇的にうまくいってはいないです。
それでも、明らかな破擦音が入った時、歌い方に息かドスかの違いをつけた時 ... では、大事そうな周波数帯域の上位2帯域が入れ替わります。
音声は経験上、3 kHzあたりのパワーが上がらない傾向にありそうです。これが厄介。これにより、3 kHzを中心に双峰性のパワーの大きい帯域を平均すると、パワーの小さい 3 kHz ばかりが大事だと錯覚することになります。
素直にフォルマント帯域を推定した方がよかったかもしれない。