Math TOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

記事更新の通知はXでアナウンス٩(๑❛ᴗ❛๑)
→ @maru6o6をフォロー

概要 📖 – ピクセル値の数学演算

Math TOPは、入力 TOP のピクセル値に数学演算を適用してチャンネルごとの値を変換する TOPです。Channel Pre OP / Combine Channels / Channel Post OP の 3 段階処理に加えて、Multi-Add (Pre-Add → Multiply → Post-Add) と Range (From Range → To Range のリマップ) を 1 ノードで連結し、RGBA 各チャンネルに個別の演算を適用します。

主な用途 🎯

ピクセル値の四則演算 (加算・減算・乗算・除算)
From Range から To Range への範囲リマップ (正規化・スケーリング)
RGB チャンネルを 1 つに集約する数学合成 (Length / Average / Min / Max)
RGB と Alpha のプリマルチプライ / 逆プリマルチプライ変換
ピクセル値の絶対値化・符号反転・逆数・平方根変換

データフロー 🔄

入力: TOP テクスチャ
 ↓
Channel Pre OP (チャンネルごとの前処理)
 ↓
Combine Channels (チャンネル間演算)
 ↓
Channel Post OP (後処理)
 ↓
Multi-Add (Pre-Add → Multiply → Post-Add)
 ↓
Range (From Range → To Range のリマップ)
 ↓
出力: 変換後テクスチャ

Tips

初心者の方は、以下日本語書籍も手元にあると安心です。

リンク

まる。

実際の案件事例まで踏み込んで紹介されていて、効率よくスキルアップするなら必携の二冊です！

パラメータ解説 ⚙️

OP Page 🧮

Channel Pre OP `.preop` ⬅️

各入力チャンネルに最初に適用する単項演算

項目	内部名	説明
Off	`.off`	何もしない (素通し)
Negate	`.negate`	各値の符号を反転 (`x → -x`)
Positive	`.pos`	絶対値を取って負値を正値に変換 (`x → \|x\|`)
Root	`.root`	平方根を取る (`x → √x`)
Square	`.square`	二乗する (`x → x²`)
Inverse	`.inverse`	逆数を取る (`x → 1/x`)

Combine Channels `.chanop` 🔀

複数チャンネル間で行うピクセル単位の演算

項目	内部名	説明
Off	`.off`	チャンネル間演算なし (素通し)
Add	`.add`	選択した全チャンネルを加算
Subtract	`.sub`	最初のチャンネルから残りのチャンネルを減算
Multiply	`.mul`	全チャンネルを乗算
Divide	`.div`	最初のチャンネルを残りのチャンネルで除算
Average	`.avg`	全チャンネルの平均値
Minimum	`.min`	全チャンネルの最小値
Maximum	`.max`	全チャンネルの最大値
Length	`.len`	チャンネル値をベクトルとみなして長さ `√(r²+g²+b²)` を計算

Channel Post OP `.postop` ➡️

Combine Channels の結果に最後に適用する単項演算

項目	内部名	説明
Off	`.off`	何もしない (素通し)
Negate	`.negate`	各値の符号を反転
Positive	`.pos`	絶対値を取って負値を正値に変換
Root	`.root`	平方根を取る
Square	`.square`	二乗する
Inverse	`.inverse`	逆数を取る

OP Page その他のパラメータ 🎛️

Combine Channels Input .inputmask
Combine Channels Input (入力チャンネル選択) — Combine Channels 演算に含める入力チャンネル (R / G / B / A) を個別に選択するトグル群

Combine Channels Output .outputchannels
Combine Channels Output (出力チャンネル選択) — Combine Channels の結果を書き込む出力チャンネル (R / G / B / A) を個別に選択するトグル群

Integer .integer
Integer (整数化) — オンで結果値を整数に丸める。デフォルトはオフ (浮動小数のまま)

Multi-Add Page ➕

Multi-Add パラメータ 🧾

Pre-Add .preoff
Pre-Add (事前加算) — 各チャンネルのピクセル値に最初に加算するオフセット値

Multiply .gain
Multiply (倍率) — Pre-Add の後で乗算する係数。明るさのスケーリング全般に使用

Post-Add .postoff
Post-Add (事後加算) — Multiply の後で加算するオフセット値。(x + Pre-Add) × Multiply + Post-Add の順で適用されます

Operation `.op` ✖️

RGB と Alpha の関係を操作する追加演算

項目	内部名	説明
No Operation	`.no_op`	追加演算なし (素通し)
Multiply RGB by Alpha	`.rgbmultalpha`	RGB に Alpha を乗算 (プリマルチプライ化、`RGB → RGB × A`)
Divide RGB by Alpha	`.rgbdivalpha`	RGB を Alpha で除算 (逆プリマルチプライ、`RGB → RGB / A`)
Divide RGB by Alpha and Fill	`.rgbdivalphafill`	RGB を Alpha で除算しつつ Alpha=0 のピクセルを白で埋める

Range Page 📏

全チャンネル共通レンジ 🎚️

From Range .fromrange
From Range (入力範囲) — 全チャンネル共通の入力範囲 (low, high)。この範囲内の値を To Range にリマップ

To Range .torange
To Range (出力範囲) — 全チャンネル共通のリマップ先範囲 (low, high)。0..1 正規化や -1..1 ↔ 0..1 変換に多用

チャンネル個別レンジ (R / G / B / A) 🌈

RGBA 各チャンネルに独立した入力範囲と出力範囲を設定

From Range R .fromranger
From Range R (赤の入力範囲) — 赤チャンネル専用の入力範囲 (low, high)

To Range R .toranger
To Range R (赤の出力範囲) — 赤チャンネル専用のリマップ先範囲

From Range G .fromrangeg
From Range G (緑の入力範囲) — 緑チャンネル専用の入力範囲

To Range G .torangeg
To Range G (緑の出力範囲) — 緑チャンネル専用のリマップ先範囲

From Range B .fromrangeb
From Range B (青の入力範囲) — 青チャンネル専用の入力範囲

To Range B .torangeb
To Range B (青の出力範囲) — 青チャンネル専用のリマップ先範囲

From Range A .fromrangea
From Range A (アルファの入力範囲) — アルファチャンネル専用の入力範囲

To Range A .torangea
To Range A (アルファの出力範囲) — アルファチャンネル専用のリマップ先範囲

Common Page 🔧

Output Resolution `.outputresolution` 🖼️

出力解像度の決定方式

項目	内部名	説明
Use Input	`.useinput`	入力 TOP の解像度をそのまま継承
Eighth	`.eighth`	入力解像度の 1/8
Quarter	`.quarter`	入力解像度の 1/4
Half	`.half`	入力解像度の 1/2
2X	`.2x`	入力解像度の 2 倍
4X	`.4x`	入力解像度の 4 倍
8X	`.8x`	入力解像度の 8 倍
Fit Resolution	`.fit`	指定解像度に縦横比を保持して収める
Limit Resolution	`.limit`	指定解像度を上限としてクランプ
Custom Resolution	`.custom`	`Resolution` パラメータで任意指定

Resolution `.resolution` 📐

カスタム解像度の幅・高さ指定 (Output Resolution = Custom 等の時のみ有効):

Resolution W: 出力幅 (ピクセル単位)。Output Resolution が Custom Resolution / Fit Resolution / Limit Resolution の時に有効
Resolution H: 出力高 (ピクセル単位)。同上

Resolution Menu `.resmenu` 📋

よく使う解像度プリセットのドロップダウン:

Resolution Menu: NTSC / PAL / HDTV 720 / HDTV 1080 / 4K UHD 等のプリセットから選択すると Resolution W / Resolution H が自動セットされる

Use Global Res Multiplier `.resmult` 🔢

プロジェクト全体の解像度倍率の適用:

Use Global Res Multiplier: Edit > Preferences > TOPs の Global Resolution Multiplier をこの TOP に適用するかどうか。プロトタイプを低解像度で動かしつつ最終出力で一括フル解像度化する運用に便利

Output Aspect `.outputaspect` 📏

出力アスペクト比の決定方式

項目	内部名	説明
Use Input	`.useinput`	入力 TOP のアスペクトを継承 (伝播事故の元、非推奨)
Resolution	`.resolution`	解像度から自動導出 (推奨デフォルト)
Custom Aspect	`.custom`	`Aspect1` / `Aspect2` で手動指定

Aspect `.aspect` 📐

カスタムアスペクト比の指定 (Output Aspect = Custom Aspect の時のみ有効):

Aspect1: 横方向アスペクト値 (Output Aspect = Custom Aspect の時のみ有効)
Aspect2: 縦方向アスペクト値 (同上)

Input Smoothness `.inputfiltertype` 🎚️

入力テクスチャのサンプリング方式

項目	内部名	説明
Nearest Pixel	`.nearest`	最近傍ピクセルサンプリング (ピクセルアート向け、ジャギーが残る)
Interpolate Pixels	`.linear`	バイリニア補間 (滑らか、デフォルト)
Mipmap Pixels	`.mipmap`	ミップマップ補間 (縮小時のモアレ抑制、わずかにコスト高)

Fill Viewer `.fillmode` 🖥️

ビューア内でのテクスチャの収め方

項目	内部名	説明
Use Input	`.useinput`	入力 TOP の Fill Viewer 設定を継承
Fill	`.fill`	ビューアいっぱいに引き伸ばす (アスペクト無視)
Fit Horizontal	`.width`	横幅に合わせて収める (上下に余白)
Fit Vertical	`.height`	縦幅に合わせて収める (左右に余白)
Fit Best	`.best`	アスペクト保持で内側に収まる最大サイズ
Fit Outside	`.outside`	アスペクト保持で外側まで覆う最小サイズ (はみ出しあり)
Native Resolution	`.nativeres`	テクスチャのネイティブ解像度のまま等倍表示

Viewer Smoothness `.filtertype` 🎛️

ビューア表示時のサンプリング方式

項目	内部名	説明
Nearest Pixel	`.nearest`	最近傍ピクセルサンプリング (ピクセル単位での確認向け)
Interpolate Pixels	`.linear`	バイリニア補間 (滑らか、デフォルト)
Mipmap Pixels	`.mipmap`	ミップマップ補間 (縮小ビュー時のモアレ抑制)

Passes `.npasses` 🔁

オペレータの反復実行回数:

Passes: TOP の処理を何パス繰り返すかの整数値。前回パスの結果が次回パスの入力になる。多段リマップや反復スケーリングに利用

Channel Mask `.chanmask` 🎨

処理対象のチャンネルマスク (R/G/B/A 個別トグル):

Channel Mask: R / G / B / A 各チャンネルのオン・オフトグル。オフのチャンネルは Math TOP の演算を受けず入力値がそのまま通過

Pixel Format `.format` 🎨

出力テクスチャのピクセルフォーマット (ビット深度・チャンネル構成)

項目	内部名	説明
Use Input	`.useinput`	入力 TOP のフォーマットを継承
8-bit fixed (RGBA)	`.rgba8fixed`	標準 8 ビット固定小数 RGBA (デフォルト、軽量)
sRGB 8-bit fixed (RGBA)	`.srgba8fixed`	sRGB ガンマ補正済 8 ビット RGBA
16-bit float (RGBA)	`.rgba16float`	16 ビット浮動小数 RGBA (HDR・中間処理向け、1.0 超や負値も保持)
32-bit float (RGBA)	`.rgba32float`	32 ビット浮動小数 RGBA (最高精度、メモリ大)
10-bit RGB, 2-bit Alpha, fixed (RGBA)	`.rgb10a2fixed`	10-10-10-2 ビット固定小数 (バンディング抑制)
16-bit fixed (RGBA)	`.rgba16fixed`	16 ビット固定小数 RGBA
11-bit float (RGB), Positive Values Only	`.rgba11float`	11-11-10 ビット浮動小数 RGB (アルファは 1.0 固定、HDR 軽量、負値不可)
16-bit float (RGB)	`.rgb16float`	16 ビット浮動小数 RGB (アルファなし)
32-bit float (RGB)	`.rgb32float`	32 ビット浮動小数 RGB (アルファなし)
8-bit fixed (Mono)	`.mono8fixed`	8 ビット固定小数モノクロ (RGB 同値、Alpha=1.0)
16-bit fixed (Mono)	`.mono16fixed`	16 ビット固定小数モノクロ
16-bit float (Mono)	`.mono16float`	16 ビット浮動小数モノクロ
32-bit float (Mono)	`.mono32float`	32 ビット浮動小数モノクロ
8-bit fixed (RG)	`.rg8fixed`	8 ビット固定小数 R+G 2 チャンネル (B=0, Alpha=1.0)
16-bit fixed (RG)	`.rg16fixed`	16 ビット固定小数 R+G
16-bit float (RG)	`.rg16float`	16 ビット浮動小数 R+G
32-bit float (RG)	`.rg32float`	32 ビット浮動小数 R+G
8-bit fixed (A)	`.a8fixed`	8 ビット固定小数アルファ単体
16-bit fixed (A)	`.a16fixed`	16 ビット固定小数アルファ単体
16-bit float (A)	`.a16float`	16 ビット浮動小数アルファ単体
32-bit float (A)	`.a32float`	32 ビット浮動小数アルファ単体
8-bit fixed (Mono+Alpha)	`.monoalpha8fixed`	8 ビット固定小数モノクロ+アルファ
16-bit fixed (Mono+Alpha)	`.monoalpha16fixed`	16 ビット固定小数モノクロ+アルファ
16-bit float (Mono+Alpha)	`.monoalpha16float`	16 ビット浮動小数モノクロ+アルファ
32-bit float (Mono+Alpha)	`.monoalpha32float`	32 ビット浮動小数モノクロ+アルファ

実践アイデア 💡

Example 1: 深度マップの正規化 📐

Render TOP (深度出力) → Math TOP (From Range → To Range) → Level TOP → 表示

Render TOP から出力される深度値はカメラの Near / Far に依存して 0〜1 の範囲に収まらないことが多いため、Math TOP の From Range / To Range で 0〜1 に正規化してから後段のシェーディングに渡す定番フローです。

Render TOP の Color Buffer 0 を深度出力に設定し、Math TOP の input1 に接続
Math TOP の From Range をカメラの Near / Far の値 (例: 0.1, 100) に設定
To Range を 0, 1 に設定して 0〜1 にリマップ
Pixel Format を 32-bit float (Mono) に変更して精度を確保

Example 2: RGB からグレースケール化 ⚫

Movie File In TOP → Math TOP (Combine Channels=Average) → Reorder TOP → 出力

Combine Channels に Average を指定し Combine Channels Input で R / G / B のみを選択することで、RGB の単純平均によるグレースケール変換が 1 ノードで可能になります。後段で Reorder TOP を使えば結果を全チャンネルに複製できます。

Movie File In TOP を Math TOP の入力に接続
Combine Channels を Average に設定
Combine Channels Input で R / G / B のみオン、A をオフに設定
Combine Channels Output を R のみに設定し、後段の Reorder TOP で R を G / B にコピー

Example 3: プリマルチプライの逆変換 🔄

Movie File In TOP (プリマルチプライ済) → Math TOP (Operation=Divide RGB by Alpha and Fill) → Composite TOP

Premultiplied アルファで保存された PNG / TIFF をストレートアルファに戻したいとき、Operation の Divide RGB by Alpha and Fill を選ぶと RGB ÷ Alpha による逆プリマルチプライと、Alpha=0 のピクセルを白で埋める処理が同時に行えます。

プリマルチプライ済の素材を Movie File In TOP で読み込み、Math TOP の入力に接続
Multi-Add Page の Operation を Divide RGB by Alpha and Fill に設定
Pixel Format を 16-bit float (RGBA) 以上にして精度を確保
後段の合成 TOP で Over 演算に切替えてストレートアルファの結果を確認

Info CHOP情報 📊

Math TOPは Info CHOP による詳細情報取得に対応しています。

TOP固有情報 🖼️

resx: TOP の出力解像度 X (ピクセル単位)
resy: TOP の出力解像度 Y (ピクセル単位)
aspectx: アスペクト比 X
aspecty: アスペクト比 Y
depth: 3D テクスチャ / テクスチャ配列の深度 (2D テクスチャでは 1)
gpu_memory_used: TOP が消費している GPU メモリ量 (MB 単位)

汎用オペレータ情報 🔄

total_cooks: プロセス開始からのクック回数
cook_time: 最後のクック時間 (ミリ秒)
cook_frame: 最後にクックされたフレーム番号
warnings: 警告数
errors: エラー数

代表的な取得チャンネル 📡

resolution_x / resolution_y: 出力テクスチャの幅・高さ (ピクセル)
aspectx / aspecty: 出力テクスチャのアスペクト比 (横 / 縦)
depth: ピクセルフォーマットのビット深度 (8 / 10 / 16 / 32)
num_components: 出力チャンネル数 (1=Mono / 2=Mono+Alpha or RG / 3=RGB / 4=RGBA)
gpu_mem_used: GPU メモリ使用量 (バイト)、最適化判断の指標

トラブルシューティング ⚠️

よくある問題と解決策 🔧

❌ Problem: 範囲リマップが効かない
✅ Solution:

From Range の low と high が同じ値になっていないか確認 (ゼロ幅の範囲は無視される)
全チャンネル共通の From Range / To Range とチャンネル個別の From Range R/G/B/A が同時設定されていないか確認 (個別指定が優先)
後段で Level TOP を入れて中間値を可視化し、どこでリマップが期待外れになっているか切り分ける

❌ Problem: Combine Channels の結果が真っ黒 / 真っ白になる
✅ Solution:

Combine Channels Input で 1 つもチャンネルが選択されていない可能性 — R / G / B いずれかをオンに
Combine Channels Output で出力先チャンネルがオフになっていないか確認 (オフのチャンネルは入力素通し)
Divide モードで除数チャンネルに 0 が含まれると inf / NaN になるため、前段で Channel Pre OP を Inverse 以外にするか Pixel Format を 16-bit float (RGBA) 以上に変更

❌ Problem: 値が飽和してハイライトが白飛びする
✅ Solution:

Pixel Format を 16-bit float (RGBA) または 32-bit float (RGBA) に変更し 1.0 を超える値を保持
Multiply 値を控えめにして、後段の Tone Map TOP でトーンマップ
Channel Post OP を Root に設定すると擬似的なガンマ補正で飽和を緩和

❌ Problem: アルファチャンネルに想定外の演算が適用される
✅ Solution:

Common Page の Channel Mask で Alpha チャンネルをオフにして演算対象から除外
From Range A / To Range A を 0, 1 → 0, 1 に明示してアルファのリマップを無効化
プリマルチプライ済素材は Multi-Add Page の Operation = Divide RGB by Alpha and Fill でストレートアルファに戻してから演算

参考資料 📚

その他 🔗

公式リソース 📖

この記事はLLMと共に内容を執筆、更新しています。
最新バージョンとの項目差異など、情報の不一致を見つけた心優しい方はXもしくはInsta、メールなどよりサイト管理者までご連絡ください😎

まる。

お仕事のご依頼はDM又はメールにて。
━━━━━━━━━━━━━━━━━
Python/Touchdesigner/M5Stackをこよなく愛すフルスタックエンジニア。
専門は生理心理学、趣味はヨガやサウナ、EMS電気風呂などヘルスケア全般。
脳波や筋電、心拍を中心とした生体情報のセンシング＆インタラクティブアートづくりがライフワーク。

普段はワントゥーテンという会社で空間演出エンジニアをしています。
リファラル採用お繋ぎできますので、我こそはという尖った方は経歴と希望職種添えてDMください(エンジニア以外、営業職等もOK)。
ご飯行きましょう。

↓日常垢
Instagram：＠malmal0v0

概要 📖 – ピクセル値の数学演算

主な用途 🎯

データフロー 🔄

パラメータ解説 ⚙️

OP Page 🧮

Channel Pre OP .preop ⬅️

Combine Channels .chanop 🔀

Channel Post OP .postop ➡️

OP Page その他のパラメータ 🎛️

Multi-Add Page ➕

Multi-Add パラメータ 🧾

Operation .op ✖️

Range Page 📏

全チャンネル共通レンジ 🎚️

チャンネル個別レンジ (R / G / B / A) 🌈

Common Page 🔧

Output Resolution .outputresolution 🖼️

Resolution .resolution 📐

Resolution Menu .resmenu 📋

Use Global Res Multiplier .resmult 🔢

Output Aspect .outputaspect 📏

Aspect .aspect 📐

Input Smoothness .inputfiltertype 🎚️

Fill Viewer .fillmode 🖥️

Viewer Smoothness .filtertype 🎛️

Passes .npasses 🔁

Channel Mask .chanmask 🎨

Pixel Format .format 🎨