Yotsuba Games
Back to Node List

Distance

distance_field

Turns a mask into a grayscale distance map — the base for glows and edge gradients

Draft
Guide available
The node name and summary are available in English. Port, parameter, and article details are currently shown in Japanese.

Input Ports

NameTypeDescription
画像
input
Image
Required
形状の元になるマスク画像です（アルファか明るさで判定）

Output Ports

NameTypeDescription
マップ
output
Image
グレースケールの距離マップです

Parameters

NameTypeDefaultRangeDescription / Options
判定基準
source
Enum
Alpha—

どの値で形状の内外を判定するかです

  • OKLCH 明度OKLCH-L
    見た目の明るさで判定します。影やハイライトなど、目で見た明暗に合わせたい時に使います。
  • OKLCH 彩度OKLCH-C
    色の鮮やかさで判定します。くすんだ色と鮮やかな色を分けたい時に使います。
  • HSV 彩度HSV-S
    HSV の鮮やかさで判定します。一般的な色相・彩度・明度の感覚で選びたい時に使います。
  • HSV 明度HSV-V
    RGB の一番明るいチャンネルを基準にします。光った色や原色の強さを見たい時に使います。
  • RGB 赤RGB-R
    赤の強さで判定します。赤みだけを抜き出したい時に使います。
  • RGB 緑RGB-G
    緑の強さで判定します。緑成分だけを抜き出したい時に使います。
  • RGB 青RGB-B
    青の強さで判定します。青成分だけを抜き出したい時に使います。
  • アルファAlpha
    透明度で判定します。不透明な形だけをマスクにしたい時に使います。
  • 輝度Luminance
    RGB から計算した明るさで判定します。OKLCH より単純な白黒変換に近い結果が欲しい時に使います。
測る範囲
region
Enum
Outside—

輪郭のどちら側の距離を測るかです

  • 外側Outside
    形の中は白のまま、外へ向かって暗くなります。グロー向けです
  • 内側Inside
    形の中心ほど白く、輪郭で黒になります。内側の陰影向けです
  • 両側Both
    輪郭が0.5、内側ほど白、外側ほど黒の符号付き距離です
最大距離
max_distance
Float
161–256 / step 1

この距離（ピクセル）でグラデーションが端まで到達します

出力の読み方

region 内側 輪郭 外側
Outside 白(1.0) 白 離れるほど黒へ
Inside 中心ほど白 黒(0.0) 黒
Both 0.5超〜白 0.5 0.5未満〜黒

技術詳細

  • チャンファー2パス法（1 / √2 重み）による近似ユークリッド距離です
  • Inside はキャンバスの端も「外側」として扱います（全面不透明のタイルでも距離が出ます）

使用例

  1. グロー: シルエット → Distance(Outside) → Gradient Map（発光色ランプ）→ Blend(Add) で元画像に重ねる
  2. 内側の陰影: Distance(Inside) → Gradient Map で「フチが暗く中心が明るい」塗りを作る
  3. 等高線: Distance(Both) → Posterize で形状に沿った縞模様を作る
Back to Node List
Distance — PixPipeline Node Reference