😎

セル・オートマトンで2D流体、光シミュレーション

2023/04/06に公開

Terrariaが好きなので、それっぽいものを作りました。
リアルではないのでそこは注意。
repogitory
WebGLDemo
以前作ったUIシステムZimGuiのデモでもあります。

光シミュレーション

先に行っておくとこれはすこしセル・オートマトンっぽくないやり方です。
原理は簡単に言えば、光源の色を置いてBlur(ぼやけさせる)です。
BlurShaderを書いたことがある人ならわかると思いますが、基本的に周辺の色をある程度の範囲で取得して距離を引数に持つ関数で割るのが通常です。
しかし、
-パフォーマンス的に調べられる範囲が狭くせざるを得ない。
-媒質による透過率の違いを出すことが難しい。
という欠点があります。
ただ今回はPixelが目立っていてもリアルでなくてもよいので、ズルをします。縦横のみで端から端まで、直線的にBlurします。
以下、手順------

セルごとに色(光源)とRGBそれぞれの減衰率を決め、
行列の端に行く。ループの最初に黒を手持ちの色する。
①次のセル(上下左右の)に移動
②現在のセルの色が手持ちの色より明るければ手持ちの色を更新、
そうでなければ現在のセルの色を手持ちの色に更新
③手持ちの色を現在のセルの減衰率で更新
①~③の手順を行(列)の反対端まで繰り返す。
さらにこれをそれぞれの行(列)で行う。

手順終わり-----
この方法の利点としては光の個数や届く距離に依存しないこと、並列化が容易であること、左右の場合ではメモリアクセスがシーケンシャルで速いことが挙げられます。

今回は右左上下右左上下の順で行いました。

恐らくテラリアでも同じような方法を用いていると思われます。

流体シミュレーション

こことそれを参考にしたここを参考にしたので、基本それらを見ればよいです。
なので、改善点だけ
これが改善前で

これが改善後です。

シミュレーション自体を速めたわけではないですが、左へ進めないときは右への流量を増やす、
右へ進めないときは左への流量を増やすという方法です。
これによりなかなか流れ出ないということが改善されました。

最後に

シミュレーションは作ってて楽しいですね!!
ただ正直半分ぐらいの時間はUIの制作、UXの改善に費やしました。設定項目を扱いやすい自作ライブラリがなかったらほとんど作らなかったと思うので、自作してよかったなと感じました。今回のUIはまだまだ改善の余地があるものの、ある程度わかりやすく使いやすいものになったと思います。WebGLDemoは現状スマホやタブレットでも使えないことはないですが、想定してないので使いづらいです。そこも対応してみようかなと考えています。

Discussion