環境：UE5.4
作成マテリアル：M_Frac_UV, M_Frac_Time
前書き
Fracのノードは値を分割するノードです。「0～1」の範囲外の値をすべて「0～1」の間に収めてくれます。
たとえば、なにかをループさせるために使われるケースが多いです。
それでは、例を2つ見ていきましょう。
ケース１：UVを分割する
[使用マテリアル：M_Frac_UV]
UV拡大・縮小の章では「Multiply」ノードを紹介しました。テクスチャの設定が「Wrap」の場合は、Multiplyだけで問題なくテクスチャを繰り返すことができます。
しかし、「Clamp」に設定された場合は、テクスチャが1回分だけ表示され、余った部分が引き伸ばされてしまいます。「Frac」を使えば、UV自体が分割されるため、Clampに設定されたテクスチャでも横や縦に繰り返すことが可能です。
以前は、Multiplyを使用すると、UVの各座標が掛け算によって更新されることを解説しました。上記の例では、「5」を掛けるため、UVの動作範囲が「0～5」に変更されます。そして「Frac」が「0」と「1」の間に値を収める役割を果たすため、「0～1」のUVが5回分に分割されます。
Wrapに設定するだけで同じ結果になるのならば、Fracは要らなくない？
と思う方が多いのでしょう。UVを分割メリットは色々あります。
たとえば「回転」（CustomRotator）を使ってみましょう。
以前の「UV回転」章で解説したノードです。
この例では「Frac」がないと、画像がUVの原点（左上の角）を中心に回転します。しかし、それぞれの猫の中心を軸に回転させたい場合は、「Frac」ノードが必須です。
ケース２：Timeを分割する
[使用マテリアル：M_Frac_Time]
最適化を行う際、「Time」ノードを「Frac」とセットにすることがよくあります。「Time」は、エンジンやゲームの開始時点からカウントを開始します。画面に表示されなくても、開始時点から「Time」が永遠に進み続けます。
プラットフォームによりますが、「Time」の値が非常に大きくなると、アニメーションがカクつく可能性があります。プレイヤーがスリープ状態のゲームを再開すると、UIアニメーションがフリーズするほど遅くなる現象が起こることもあります。それを防ぐために、「Time」の値を「0～1」の範囲に収める必要があります。
「DebugScalarValues」ノードは、出力値を確認できるようにするデバッグのノードです。
「Time」ノードを「Frac」に通して「DebugScalarValues」の「Numbers」に接続し、ノードを右クリックして「Start Previewing Node」を選択します。そうすると、プレビューに白数字が表示されます。
「Frac」ノードを外し、「Time」だけを確認すると大きい数字が表示されます。エンジンを開いてから経った時間を示してます。
「Time」と「Frac」の関数をわかりやすくするため、Desmosグラフを作りました。
Timeが「線形関数」になっており、行き止まらず永遠に進み続けます。一方、「Frac」かけられた「Time」の関数は「1」に達成すると、線が横に続きます。これで「Y」軸の出力値が限定され、小さい値に収めることができます。
Timeの関数
FracにかけたTimeの関数
そのカーブを使ってアニメーション作成すると、サインと違い、位置のスタート時点へ滑らかに戻らず、アニメーションが急にリセットされます。
以下のGifでは「Frac」がないと、猫が表示されず、表示範囲外に遠く行ってしまいます。（Clampに設定をしたテクスチャの場合）
これで「Frac」ノードの解説は以上です。