ゲームエフェクトデザイナーのブログ | A Real-Time VFX Artist's Blog

About Making Materials on UE, Making Tools with C#, etc

UE4 PlotFunctionOnGraphで値をグラフで表示する

マテリアルを作成したり中身を解析したりしている時に、値の変動を脳内では処理できず紙に手描きでグラフを書くことがよくあるのですが、「値をグラフにするノードは無いものか」と思っていたところ hirapotさん(@hirappot)から「PlotFunctionOnGraph」というマテリアル関数を教えて頂きました!

hirapotさんありがとうございます!

ということで早速使ってみました。各Inputの説明は図に記述しています。
(Inputピンの「f(x)」にはUV座標のUを与えてやる必要があるっぽいです)

f:id:moko_03_25:20180516013935j:plain

するとこのような結果に!これぞ求めていたものです‥素敵!

f:id:moko_03_25:20180516013930g:plain

ちなみに中身を見てみたらこんな感じで把握するのが大変だったので‥

f:id:moko_03_25:20180516013927j:plain

とりあえず最小限の構成に整理してみました。
グラフのVと入力した値のUの距離(Distance)が 0(つまり一致する位置)に色が付くようになっているようです。

ただ注意がひとつあって、Inputでグラフの座標の範囲を指定しますが、その範囲をグラフ化したい値にも反映させないとグラフと値が一致しません。
そのため、グラフのVとTimeを足し合わせた結果を出力するようにしました。

f:id:moko_03_25:20180516013922j:plain

なので下図のように出力した値を使った値を入力する必要があって、ループした見た目の気持ち悪い構成になっていますが‥ひとまずこちらでうまく動作しました。
こういう時、マテリアル関数をふたつに分割すると良いのでしょうけれど、まいっかと。

ちなみに、試しにグラフ化するのに利用したのはLinearSine関数です。
このマテリアル関数は3つのOutputピンから三角波矩形波を出力します。

f:id:moko_03_25:20180516013919j:plain

1つめのOutputのLinearSineをグラフ化すると三角波になっているのが確認できます。

f:id:moko_03_25:20180516014032g:plain

ついでに2つめのOutputのRounded Linear Sineも試してみます。

f:id:moko_03_25:20180516014029j:plain

するとこんな感じ。
Debugノードで数値化はできますが、緩急はビジュアル化しないと分からないですよね。

f:id:moko_03_25:20180516014024g:plain

3つめのOutputのDirectionも試してみます。

f:id:moko_03_25:20180516014021j:plain

こちらは矩形波だということが確認できました。

f:id:moko_03_25:20180516014016g:plain

という訳で、グラフ化でした。お試しあれ!

何か間違っていたりもっと良い方法があったりしたら教えてください‥!
(customノードで直接描画するようにした方が綺麗なグラフにできますかね‥)