THREE.JS THREE-VRM をいじってみた
pixiv様提供のVRMで遊んでみた
リンク
vroid
three-vrm
vroidのvroid studioでサンプルの女の子を少しいじくって
three-vrmのbasic.htmlサンプルをphp化してローカルファイルを読めるようにしました
まじかる☆ですくとっぷ
で踊らせてみた
奥が深そうだからこれでもっと遊んでみようかな
第1弾
![](./tesuko.jpg)
てす子
![](./tesukopony.jpg)
てす子 ポニーテール
![](./misa.png)
美彩
![](./mituki.jpg)
美月
![](./天音.png)
天音
![](./laikamade.jpg)
レイカ
第2弾
![](./マッチョ伊東.png)
マッチョ伊東
![](./hatachi.jpg)
自称20歳
![](./miinyan.jpg)
みぃにゃん
![](./kana.jpg)
夏菜
![](./iceちゃん.jpg)
アイスちゃん
![](./megu.png)
めぐ
![](./のんたんメイド服.png)
のんたん
第3弾
![](./キャロット03号メイド服.png)
キャロット03号
![](./メルパーカー.png)
メル
![](./ねむ.png)
ねむ
![](./デミちゃん.png)
デミちゃん
![](./うさぴょん.png)
うさぴょん
![](./イヴレプリカ.png)
イヴレプリカ
第4弾
![](./お稲荷さん.png)
お稲荷さん
![](./ねこむすめ.png)
ねこむすめ
![](./正式モデルノービス.png)
正式モデルノービス
![](./正式モデルロイド05号.png)
正式モデルロイド05号
![](./ちび正式モデルロイド05号.png)
ちび正式モデルロイド05号
![](./ALICE06号.png)
正式モデルALICE06号
第5弾
![](./まお.png)
まお
![](./ちびまお.png)
ちびまお
![](./結衣.png)
結衣
![](./ちび結衣.png)
ちび結衣
![](./レオナ.png)
レオナ
![](./ちびレオナ.png)
ちびレオナ
- VRM ロードテスト - .php
- VRM ロードテスト - .zip
![](./vrmtest.jpg)
てす子 モーション.htm
てす子 モーション.zip
![](./tesuko_mmd.jpg)
vroidのモーションテスト
three.jsのwebgl_loader_mmd.htmlサンプルのロードURLを変えただけ
こんな感じか
あちゃー顎の部分が黒くなっちゃった
エラーログ見たところ多分MIME-TYPEが.wasmを認識してないからだと思うんだけれど
このHPはレンタルサーバーでやってるから.htaccessでMIME-TYPEを追加しようにも
サーバー管理者がAddTypeディレクティブを認めてないみたい
サーポートに連絡してどうにかしてくれって頼んでるけれど
THREE.JSを使ってはいけませんと言われるのならば
安いとこの専用サーバーに引っ越そうかな
安いけれど高いなぁ
企業活動じゃなくて趣味なのになぁ
むしろ自宅サーバー作ろうかな
追記
.wasm読めなくなっちゃった
ここのサーバー設定じゃ
.wasm使えないのかな?
これはめんどくさいから放置
- VRM BVHテスト - .htm
- VRM BVHテスト - .zip
![](./bvhtest.png)
BVHモーションファイルを読めるようにした
スカイボックスは
["~px","~nx","~py","~ny","~pz","~nz"]
でファイル名が終わるイメージファイルを6つ読み込めば適用できます
なかなかいい感じ♪
ボーンの設定がうまくいかないと難しいなぁ
鏡音リン(偽物)が説明する #VRoidStudio のデータを動かしてみよう @YouTube
動かす手順
1.VRoidStudioで.vrmファイルにエクスポート
2.VRM2PMXConverterで.pmxファイルにコンバート
3.MikuMikuDanceで読み込んでごにょごにょで動かす
全て無料ソフトで出来ます
■■■ THREE.JSプログラミング講座 ■■■
3Dプログラミング講座
NAS6LIB
THREE.JSテスト解説・THREE.JS使い方
THREE.JS examplesをいじってみた(フレネル反射透過シェーダー)
![](./fresnel.gif)
THREE.JS (半透明シェーダー)
![](./earth3js.jpg)
THREE.JS 3D演算で必要な計算(具体例)★とても重要★
THREE.JS THREE-VRM をいじってみた
![](./vrmtest.jpg)
<<prev 3D演算で必要な計算(具体例) : 工事中 next>>
戻る