UV座標のOverrideを理解する

背景

f:id:SiunCyclone:20200508230243p:plain

上の画像で,左上にあるテクスチャのUV空間を,GradientNoiseでOverrideした場合,右下のようなテクスチャが得られる.
この時Overrideは具体的にどのような処理を行っているのか理解できなかったので調べた.

UVの基本

f:id:SiunCyclone:20200508231210p:plain

  1. まず,UV空間は左下を(0,0)右上を(1,1)として定義されている.
    f:id:SiunCyclone:20200509000053p:plain

  2. 次にこのUV空間をX軸方向成分,Y軸方向成分のみ取り出すと以下のような1次元配列となる.
    f:id:SiunCyclone:20200509000115p:plain

  3. この1次元配列をUVに繋げた場合,0は(0,0),0.1は(0.1,0.1),1は(1,1)のようにして渡される(注1) f:id:SiunCyclone:20200509000415p:plain

  4. UV座標の(0,0),(0.1,0.1),・・・(1,1)が意味するのは画像のピンクの直線部分である f:id:SiunCyclone:20200509000826p:plain

  5. 対応関係を示すと以下のようになる f:id:SiunCyclone:20200509001150p:plain

本題

以上を踏まえると最初の画像が読み解けるようになる f:id:SiunCyclone:20200509002730p:plain  
   

注1

シェーダコードを実際にみて確かめた
上:今回のように値が1つの場合
f:id:SiunCyclone:20200509001350p:plain 下:デフォルト f:id:SiunCyclone:20200509001358p:plain なおvec = (1,2,3)があった場合
vec.xx = (1, 1)
vec.xy = (1, 2)
vec.zz = (3, 3)
となる