VRM を読み込んで ~ 音量に合わせてチョップさせてみた
VRM - VR向け3Dアバターフォーマット - を読み込んでみます。
VRMのページ : https://vrm.dev/
今回は 音量に合わせてチョップです。
音量部分はいつぞやのWebAudioAPIのサンプルからコピペ、無駄にミキシング & 1 kHz に反応です。もっとミニマムなサンプルも用意すべきでした、とても無駄に大きい。反応するのはFile0の方だけ。File1は伴奏用ということで。
Drop files here
File0
File1
mixing source0 :
mixing source1 :
Analyser
| SmoothingTimeConstant : | |
| MinDecibels : | |
| MaxDecibels : |
| mixed | ||
| audio0 | ||
| audio1 |
動作チェックはhttps://vroid.com/ (Mac版) 0.7.2 で自作したモデル。Mac の Chrome でだけ。
"Three.js での回転" かつ "VRM での関節の回転"がそれぞれ手探り。
肘が痛そうな方向に曲がっていそうです。その辺のコツを早く掴みたいなぁ...。
動きにアサインする音量に関しても、周波数帯の絞り方、レンジとか、やはり深掘りするべきだなと。音量じゃなくアタック検出にするべきとか、いろいろ。
VRM読み込みあたりは、kiruroboさん のサンプルを参考にしています。
モデル使用に関する免責事項のお手本は、
https://facevtuber.com/ さん。
[参考文献]
VRM を読み込んでみた ~ Three.js で表示
VRM - VR向け3Dアバターフォーマット - を読み込んでみます。
VRMのページ : https://vrm.dev/
今回は Three.js で表示するところまで。
Drop files here
https://vroid.com/ (Mac版) 0.7.2 で自作したモデルでは読めました。
この次は表情...。VRoidでいろいろ表情を作れるのがなかなか楽しいです。
果たして、簡単に自前で動かせるものなのでしょうか、不安です。
VRM読み込みあたりは、kiruroboさん のサンプルを参考にしています。
canvas上でのマウス操作の回転は、だいぶ自分で書きました。
3Dの回転のUIは、どうも決定打に欠ける感じがします。
2Dのマウスだけでやるのは、そもそも足りなくて当たり前かもしれませんが。
モデル使用に関する免責事項のお手本は、
https://facevtuber.com/ さん。偉大なる先人、先人は偉大。
( YouTube に動画をあげるときにお世話になっています。ありがたい！)
[参考文献]
VRM を読み込んでみた ~ meta 情報の取得
VRM - VR向け3Dアバターフォーマット - を読み込んでみます。
VRMのページ : https://vrm.dev/
ざっくり、glTF2.0ベースで人体モデル + ライセンスデータ (meta情報?) らしい。
とりあえず。
今回は meta 情報が取得できました。Three.js で表示するところまでいけてません。
Three.js には既に VRMLoader が入っているみたいで、ありがたい。
kiruroboさん のサンプルを参考にしています。
Drug & Drop でモデルの読み込みができるので、自モデルで試しやすくてありがたい。
Drop files here
https://vroid.com/ (Mac版) 0.7.2 で自作したモデルでは読めました。
VRoid、VRoid単体でもなかなか楽しいです。
VRM で何かできるものを公開する上では、
ライセンスデータをユーザに提示するのは大事そうだなと思っています。
https://facevtuber.com/ さんをお手本にするつもり。
( YouTube に動画をあげるときにお世話になっています。ありがたい！)
[参考文献]
Simutransのセーブデータ (非圧縮xml のみ) を読み込み->書き出し ~ 線路 ⇄ 道路
[趣旨]
Simutransのセーブデータ弄り 〜 をします。
Simutransのセーブデータ (非圧縮xml のみ) をパースしてエディットして、また書き出しです。
今回は、線路と道路を置き換えてみます。
頑張って作った高架の線路網が、細かすぎてバスにしたくなってしまったのです。
これ、現実でもありがちなことなので、本体改造でツール化したいところです。
↓ Simutransのセーブデータ (非圧縮xml のみ) をドラッグアンドドロップすると、「ダウンロード」と書かれたリンクが追加されます。"output.sve"としてダウンロードできるはず。開発環境は、macのchrome。
| type | addon | |
| original | ||
| alternative |
Drop files here
originalのaddon欄が空白だと全部が置き換え対象。alternativeのaddon欄が空白だと、読み込み時に適当に置き換えられます。
こんな感じで、碁盤病が捗ります。
セーブデータいじり実験 線路⇄道路置き換え + ミス #Simutrans pic.twitter.com/sRuXUEEUFK
— shingoushori (@shingoushori) July 27, 2019
画像で出ている通り、線路/道路上に残る施設がマズイところ。
そして、セーブデータ上でのアドオンの名前を探すのが大変。
この辺りは今後のいじりどころ。
[参考文献]
クライアントサイドJavaScriptでXML文書のDOMをパースする
HTML非表示・使用不可メモ(Hishidama's disabled/visibility/display Memo)
Simutransのセーブデータ (非圧縮xml のみ) を読み込み->書き出し ~ 特定領域のレベル下げ
[趣旨]
Simutransのセーブデータ弄り 〜 をします。
Simutransのセーブデータ (非圧縮xml のみ) をパースしてエディットして、また書き出しです。
今回は、特定領域のレベルを特定レベルまで下げます。
ついでに、平坦化しちゃいます。
シンプルに地平だけを下げます。橋や道路などの分断をケアすべきですが、今回は何もやれてません。
↓ Simutransのセーブデータ (非圧縮xml のみ) をドラッグアンドドロップすると、「ダウンロード」と書かれたリンクが追加されます。"output.sve"としてダウンロードできるはず。開発環境は、macのchrome。
| topleft : | x | y |
| bottomright : | x | y |
| target : | z |
Drop files here
こんな感じで、碁盤病が捗ります。
#simutrans セーブデータいじり 碁盤で組むには邪魔な街を、丸々レベル下げ pic.twitter.com/xhKpBKDwpy
— shingoushori (@shingoushori) July 21, 2019
碁盤病のために全てを失った街 #simutrans pic.twitter.com/EYtF8DO6ae
— shingoushori (@shingoushori) July 17, 2019
どうにも処理が重いのが難点です...。
[参考文献]
クライアントサイドJavaScriptでXML文書のDOMをパースする
HTML非表示・使用不可メモ(Hishidama's disabled/visibility/display Memo)
A-Frame + Web Audio API で ランダムに箱がでるプレイヤー/ミキサーのテスト
xRしたい！ VTuberしたい！ ということで、A-Frame。
VTuberするのにアバターの必要性を感じなくなってきたので、A-Frame であれこれやってみています。
今回はとりあえず Web_Audio_API と繋いでみました。
File0とFile1に音楽データがセットできて、両方にセットすればミキサー。(以前に作ったものをコピペ)。片方にセットすれば...プレイヤー。
ランダムに箱が出たり回転したりするのは、File0のみ。なんとなく。
スペクトログラムに引いた線があることから、その線のところ (1 kHz と 4 kHzあたり) の音量が、スペクトログラムの真ん中より上になるような値であれば、3Dがぐるぐる。
[proc] ボタンで手動でも発火させられます。
なんとも無意味ですが、動けばとりあえず楽しい。
div a-frame
File0
File1
mixing source0 :
mixing source1 :
Analyser
| SmoothingTimeConstant : | |
| MinDecibels : | |
| MaxDecibels : |
| mixed | ||
| audio0 | ||
| audio1 |
この記事に際して、新たに行き着いた Web Audio API に関する記事２つ。
Audioを停止（終了）させるには pause() → currentTime = 0;
「MediaDevices.getUserMedia() 」について;
やはり WebAPI だけあって、メンテしたほうがよさそう。
過去の記事に遡って修正するとか、一つずつの記事に全部書かずにモジュール化を模索するとか、やるべきことがたくさん。
とりあえず、(以前に作ったものをコピペ)から、今回の記事で気づいて直したのが２点。
・Macのchromeで navigator.getUserMedia() が消えてエラーが出てて動かなかったのを応急手当て。 ・[stop]を押しても音楽データの再生自体は止まっていなかったのを修正。
コピペ元の記事からこの記事までの間の記事も更新しておく ... 。うーむ。
