UnityShaderGraphで多角形の表現を行う

本日はUnity Shader調査枠です。

UnityではHDRLもしくはURPを導入することでShaderGraphが使用できるようになります。

ShaderGraphを用いることで専門的な知識が無くてもShaderをより簡単に構築できるようになりました。

今回は昨日作成した多角形の表現をShaderGraphで行います。

〇多角形の方程式のおさらい

Shaderで多角形を表現する方程式は次のようになります。

前回はShaderLabで多角形表現を行いました。

redhologerbera.hatenablog.com

〇ShaderGraphで多角形表現を行う。

①[Unlit]のShaderGraphを作成します。

②ShaderLabでのフラグメントシェーダー部を再現する

                fixed4 col = _Color*(sin(map(i.uv) * 10) + 1) /1.6;
                
                return col;

colは表示カラーを意味します。

[_Color]という変数を作成します。

③[Multiply]ノードを作成し、作成した変数[Color]を入力に、出力部をUnlitの[Color]と接続します。

これはShaderLabでいうところの次の部分に当たります。

fixed4 col = _Color*  

④[sin]ノードと[Divide]ノードを作成し画像のように[Multiply]と接続します。

これはShaderLabでいうところの次の部分に当たります。

fixed4 col = _Color* (sin() /1.6;

⑤[Multiply]と[Add]を作成します。　画像のようにつなぎます。

fixed4 col = _Color*(sin(  * 10) + 1) /1.6;

⑥次にShaderLabのmap変数を作成します。

        float map(float2 uv){
                float2 fPos = frac(uv);

                fPos.x = fPos.x * 1. - .5;
                fPos.y = fPos.y * 1. - .5;

                return dPolygon(fPos * _Pattern, _N, 0) - _Time.x * 3.;
            }

map変数はdPolygonが返されます。

 return dPolygon(fPos * _Pattern, _N, 0) - _Time.x * 3.;

さきに[dPolygon]を作成します。

   float dPolygon(float2 p, int n, float size){
                float a = atan2(p.x, p.y) + PI;
                float r = 2 * PI / n;
                return cos(floor(.5 + a / r) * r - a) * length(p) - size;
            }

dPolygonではUvの成分ごとに処理を行っていますが、UVノードでは以下のようにVector４型として扱い、成分を取り出すことができませんでした。

そこで今回は[CustomFunction]ノードを使用しました。

redhologerbera.hatenablog.com

⑥[UV]ノード、[CustomFunction]ノードを作成します。

⑦[CustomFunction]のStringに以下のコードを記述します。

float a = atan2(UV.x, UV.y) + PI;
float r = 2 * PI / n;
output = cos(floor(0.5 + a / r) * r - a) * length(UV) - size; 

これはPolygonの中身と同じです。

これをUVノードと接続します。

以上で[Polygon]が完成しました。

次にmap変数を作成します。

⑧[Multiply]ノードを作成しUVと接続します。

⑨[_Pattern]変数をMultiplyと接続します。

⑩[Polygon]の入力に変数[_N]を接続します。

⑪[fraction]ノードを作成し、UVと接続します。

以上でShaderGraphでも多角形の表現ができました。

変数[N]の値を変えると正N角形の表現が行えます。