Babylon.js:合わせ鏡とミラーハウス
この記事のスナップショット
合わせ鏡
ミラーハウス
操作は (h)キーを押して確認。
(コードを見たい人はURLから full.html
を消したURLを指定してください)
ソース
085_mirror1 .. 合わせ鏡
085_mirror2 .. ミラーハウス
ローカルで動かす場合、./js 以下のライブラリは 069/js を利用してください。
概要
MirrorTextureを使って「合わせ鏡」ができないかと思いましたがダメでした。
また、鏡つながりで「ミラーハウス」を作ってみました。
やったこと
公式にMirrorTextureというのがあるので、興味本位で「合わせ鏡」をやってみました。
また、鏡つながりで「ミラーハウス」を、迷路モジュール(薄い壁)を使って作ってみました。
- 合わせ鏡
- ミラーハウス
なお、tips にあるミラー関連の作品は以下のとおり。
- Babylon.js Tips集
合わせ鏡
MirrorTextureの使い方は、下記を設定するだけなのですが、平面の向き(a, b, c)や切片位置(d)を間違えると何も映らないので、初めてだとちょっと戸惑うかも。
- 反射面(平面の方程式の係数 a, b, c, d)を設定
- 反射させたいメッシュの登録
合わせ鏡として、キャラクターコントローラーの前後に鏡を配置して、反射させるメッシュに(地面、キャラクターコントローラー、鏡)を追加しました。
結果、鏡が移りこんでいるけれど「真っ白」に。(>_<)
そう都合よくいかないものらしい。
合わせ鏡
ミラーハウス
薄い壁の迷路を応用してミラーハウスを作ります。
といっても壁の前後を MirrorTexture をつけた板ではさむだけですが。
ただし、MirrorTexture で気を付ける点として、鏡面の平面を登録させなくてはならないこと。
座標値ごとに MirrorTexture を用意する必要があります。
ちなみに「合わせ鏡」ができないことは確認済みなので、鏡面として登録するのは「地面」と「」キャラクターコントローラー」のみとします。(壁を登録しても白くなるだけだし)
ミラーハウス
まとめ・雑感
「合わせ鏡」ができたら計算量が大変なことになる、下手したら無限ループになりかねないので、今回のような挙動は仕方ないとは思いますがちょっと残念。
Discussion