![](https://kinnaji.com/wp-content/uploads/2019/12/image-60-1.png)
目次
※この記事で使用しているUnrealのVersionは04.21.1です。
※この記事のサンプルプロジェクトは以下URLにアップされています。
サンプルプロジェクト
関数グラフっぽいものを書く レベル【★★☆】
今回は、需要があるかは皆無ですが、マテリアルで関数グラフを書いてみたいと思います。
関数グラフとは、中学から習うY=aXなどの関数をグラフに表したものです。(↓こんなやつ)
![](https://kinnaji.files.wordpress.com/2019/01/graph.png)
このX軸とY軸をマテリアルノードにある「TextureCoordinate」を代用することで再現します。
まずはグラフのもととなる仮想の座標系となるマテリアル関数を作成します。
![](https://kinnaji.files.wordpress.com/2019/01/image-46.png)
↓中身
![](https://kinnaji.files.wordpress.com/2019/01/image-47.png)
座標系を作成する際は、「UVRemap_0-1_ToRange」というマテリアル関数を仕様すると簡単に作れます。
次に、ひとまず簡単な指数関数(Y=aX^n+b)のグラフを書こうと思いますので、指数関数用のマテリアル関数を作成します。
指数関数とは
![](https://kinnaji.files.wordpress.com/2019/01/image-48.png)
中身↓
![](https://kinnaji.files.wordpress.com/2019/01/image-49.png)
MF_ValueStepの中身
![](https://kinnaji.files.wordpress.com/2019/01/image-34.png)
そして、作成した2つの関数を使って以下のように組んでみます。
![](https://kinnaji.files.wordpress.com/2019/01/image-50.png)
できたマテリアルをPlaneにはっつけてみるとこんな感じの見た目になりました。
![](https://kinnaji.files.wordpress.com/2019/01/image-51.png)
きれいに二次関数のような見た目になっています。
ただ、グラフの線の部分で白黒に分かれてしまっているので、これを普通の線にしたいと思います。
![](https://kinnaji.files.wordpress.com/2019/01/image-52.png)
![](https://kinnaji.files.wordpress.com/2019/01/image-53.png)
MF_PixelOffsetの中身
![](https://kinnaji.files.wordpress.com/2019/01/image-37.png)
かなり処理がぐちゃぐちゃですが、大雑把な処理の内容としては、基準の座標とOffsetされた座標の値を比べ、差がある部分の値を抽出しているというものです。
これを適応したPlaneメッシュを見てみると
![](https://kinnaji.files.wordpress.com/2019/01/image-39.png)
このように関数グラフの線が浮かび上がってきます。
ついでにグリッド線も入れてみます。
![](https://kinnaji.files.wordpress.com/2019/01/image-55.png)
![](https://kinnaji.files.wordpress.com/2019/01/image-56.png)
MF_Gridの中身
![](https://kinnaji.files.wordpress.com/2019/01/image-57.png)
結果↓
![](https://kinnaji.files.wordpress.com/2019/01/image-58.png)
いい感じの見た目になりました。
では今度は、仮想の極座標を使って正葉曲線(バラ曲線)を作ってみたいと思います。
バラ曲線とは
バラ曲線はr=a cosθといった比較的簡単な式でできています。
これをマテリアルで再現するには、以下のように処理を組みます。
![](https://kinnaji.files.wordpress.com/2019/01/image-41.png)
MF_RoseCurve_AngleMathの中身
![](https://kinnaji.files.wordpress.com/2019/01/image-40.png)
この関数を使って、先程のようにグラフ構築する処理を書きます。
![](https://kinnaji.files.wordpress.com/2019/01/image-59.png)
![](https://kinnaji.files.wordpress.com/2019/01/image-43.png)
これをPlaneにはっつけてみると、
![](https://kinnaji.files.wordpress.com/2019/01/image-60.png)
こんなように面白い形を生成してくれます。
値を変えることで葉の数や大きさが変わるので、ぜひいろいろいじってみてください。
さらっと説明してきましたが、このようにすることで役に立つかは微妙ですが、関数グラフをマテリアルで表現することができます。
センスや知識がある人なら、さまざまな関数を使って面白い表現ができるかもしれませんので、ぜひ遊んでみてください。
※この記事のサンプルプロジェクトは以下URLにアップされています。
サンプルプロジェクト