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

概要 📖 – パネル参照と複製表示

Select COMPは、他の Panel Component を参照してその内容をあたかも自分自身であるかのように複製表示する COMPです。参照先のパネル内容をそのまま表示しつつ、Background Color / Opacity / Match Size 等の Select COMP 側パラメータで装飾・寸法を上書きできます。

主な用途 🎯

• 同一 Panel COMP を複数箇所に表示するための参照ノードとして利用 (ミニマップ・サムネイル・複製ビュー)
• UI レイアウト分離: 元パネルはサブネットワーク内に置き、表示位置だけを Select COMP で配置
• 背景色・不透明度・Background TOP の上書きで同じパネルを異なる装飾で複数表示
• Match Size による参照パネルの寸法自動追従でレスポンシブな複製を構築
• Follow Selection によるネストした Select COMP チェーンの最上位 COMP からの寸法伝播

データフロー 🔄

参照元 Panel COMP (パネル本体)
 ↓
Select COMP (Select Panel パラメータでパス参照)
 ↓
Network 上の任意の位置で参照先パネルの内容を描画

---

パラメータ解説 ⚙️

Select Page 📋

パネル参照 🔗

Select COMP の中核となるパネル参照パラメータ:

• Select Panel: selectpanel — 参照先となる Panel Component のパス。指定先パネルの内容がこの Select COMP の位置に描画される
• Match Size: matchsize — オンの場合、Select COMP の Width / Height を参照先 Panel Component の寸法に自動的に揃える
• Follow Selection: followselection — 参照先がさらに別の Select COMP を指している場合、Select COMP ではない最上位の COMP まで遡って寸法を取得する

---

Panel Page 📋

表示と有効化 👁️

Select COMP の表示と有効化に関わるパラメータ:

• Display: display — パネルを表示するか非表示にするかを切替。レイアウト処理コストが発生するため、単純なオーバーレイ用途では Opacity 調整の方が高速
• Enable: enable — このパネル全体のインタラクションを有効 / 無効化
• Help DAT: helpdat — ロールオーバー時に表示するヘルプテキストを保持する Text DAT のパス

Cursor .cursor 🎛️

Select COMP 上にカーソルが乗ったときに表示するカーソル形状を選択するメニューパラメータ

項目	内部名	説明
Text Select	.ibeam	テキスト選択用の I ビーム形状
Precision Select	.cross	精密選択用のクロスヘア形状
Busy	.busy	ビジー状態を示す砂時計・スピナー形状
Activate	.activate	アクティブ化を促す形状
Invisible	.invisible	カーソルを非表示

入力ハンドリング 🖱️

マウス・タッチ入力の処理パラメータ:

• Multi-Touch: multitouch — オンの場合、最初に受け取ったタッチをマウスクリックと同様に処理 (u / v / state を更新)
• Constrain Cursor: constraincursor — カーソルがパネルに入ったらパネル内に拘束
• Click Through: clickthrough — オンの場合、このパネル上のマウスクリックを全て無視 (背面パネルに透過)
• Use Mouse Wheel: mousewheel — マウスホイール操作をパネル上でキャプチャ
• Relative UV: mouserel — オンの場合、uv の Panel Values が相対マウス移動量を反映する

Mouse UV Buttons .uvbuttons 🖱️

uv Panel Values を更新するマウスボタンの指定:

• Left: uvbuttonsleft — 左ボタンで uv を更新
• Middle: uvbuttonsmiddle — 中ボタンで uv を更新
• Right: uvbuttonsright — 右ボタンで uv を更新

リサイズ・リポジション ↔️

ドラッグによるリサイズ・移動の許可と範囲設定:

• Drag Edges to Resize: resize (resizel, resizer, resizeb, resizet) — Left / Right / Bottom / Top の各エッジをドラッグでリサイズ可能にするチェックボックス
• W Range: resizew — リサイズ可能な幅の範囲 (最小値と最大値)
• H Range: resizeh — リサイズ可能な高さの範囲 (最小値と最大値)
• Drag to Reposition: reposition — マウスドラッグでパネル自体やウィンドウを移動可能にする
• Component: repocomp — Reposition で Component を選んだ際の移動対象 Panel Component のパス
• X Range: repositionx — Component 移動時の水平方向最大範囲
• Y Range: repositiony — Component 移動時の垂直方向最大範囲

Anchor Drag .anchordrag 🎛️

Drag to Reposition が Component モードで Horizontal Mode / Vertical Mode が Anchors のときのドラッグ動作を選択するメニューパラメータ

項目	内部名	説明
Anchors	.anchors	ドラッグでリポジションすると Anchor のパラメータ値が変更される
Offsets	.offsets	ドラッグでリポジションすると Offset のパラメータ値が変更される

Scroll Overlay .scrolloverlay 🎛️

パネルがスクロールバー位置に影響を受けるかを選択するメニューパラメータ

項目	内部名	説明
Off	.off	スクロールバーがパネルに通常通り作用
Ignore	.ignore	スクロールバー移動の影響を受けない (Depth Layer は通常通り)
Ignore and Draw Over	.ignoreover	スクロールバー移動の影響を受けず、スクロールバー・兄弟パネルの上に描画

---

Look Page 📋

背景色とアルファ 🎨

背景色・アルファ・背景 TOP の設定:

• Background Color: bgcolor (bgcolorr, bgcolorg, bgcolorb) — 背景の R / G / B 各成分 (デフォルト: 黒)
• Background Alpha: bgalpha — 背景色のアルファ値
• Background TOP: top — パネル背景として描画する TOP のパス

TOP Fill .topfill 🎛️

Background TOP がパネル背景をどのように埋めるかを選択するメニューパラメータ

項目	内部名	説明
Stretch	.off	アスペクト比を無視してパネル全体に引き伸ばす
Fill Width	.horizontal	幅に合わせてアスペクト比を維持して埋める
Fill Height	.vertical	高さに合わせてアスペクト比を維持して埋める
Fill Best	.best	アスペクト比を維持しつつパネルを完全に覆う
Fill Outside	.outside	アスペクト比を維持しパネル外側まで含む形で埋める

TOP Smoothness .topsmoothness 🎛️

Background TOP のスムージングフィルタを選択するメニューパラメータ

項目	内部名	説明
Nearest Pixel	.nearest	最近傍ピクセルを使用 (拡大時にジャギーが出るがピクセル正確)
Interpolate Pixels	.linear	線形補間でスムーズに表示 (新規 Panel COMP のデフォルト)
Mipmap Pixels	.mipmap	ミップマップを使用しスケーリング時のアーティファクト・スパークルを軽減

ボーダー 📏

ボーダー色・各エッジへの色割り当て:

• Border A: bordera (borderar, borderag, borderab) — ボーダー A の R / G / B 各成分
• Border A Alpha: borderaalpha — ボーダー A のアルファ値
• Border B: borderb (borderbr, borderbg, borderbb) — ボーダー B の R / G / B 各成分
• Border B Alpha: borderbalpha — ボーダー B のアルファ値
• Left / Right / Bottom / Top Border: leftborder / rightborder / bottomborder / topborder — 各エッジ 2 ピクセルの色 (0 / Border A / Border B から選択)
• Left / Right / Bottom / Top Border Inside: leftborderi / rightborderi / bottomborderi / topborderi — 内側のボーダー色 (同じく 0 / A / B から選択)
• Border Over Children: borderover — オンの場合、ボーダーを子パネルの上に描画

Disable / Composite / Opacity 🎚️

Disable 色・Multiply RGB by Alpha・Opacity:

• Disable Color: dodisablecolor / disablecolor (disablecolorr, disablecolorg, disablecolorb) / disablealpha — Enable=Off の際に表示する専用色とアルファ
• Multiply RGB by Alpha: multrgb — RGB チャンネルにアルファを乗算
• Opacity: opacity — パネル全体の不透明度。参照先パネルにも合算で作用

Composite .composite 🎛️

兄弟パネルとの合成方式を選択するメニューパラメータ

項目	内部名	説明
Over	.over	上に乗せる標準合成
Under	.under	下に潜らせる合成
Inside	.inside	内側マスクとして合成
Outside	.outside	外側マスクとして合成
Add	.add	加算合成
Subtract	.subtract	減算合成
Multiply	.multiply	乗算合成

---

Common Page 🔧

Parent Shortcut .parentshortcut 🔗

コンポーネント内部からこの COMP へのパスとして使えるショートカット名:

• Parent Shortcut: コンポーネント内部の任意の場所からこの COMP を参照する際のショートカット名 (parent.<name> 形式で利用可能)

Global OP Shortcut .opshortcut 🌐

プロジェクト全体からこの COMP を参照するグローバル名:

• Global OP Shortcut: プロジェクト内のあらゆる場所からこの COMP へのパスとして使えるグローバル名 (op.<name> 形式で利用可能)

Internal OP .iop 📎

Internal OP シーケンス (コンポーネント内部 OP への名前付き参照):

• Shortcut: iop0shortcut — コンポーネント内部の OP に対するショートカット名
• OP: iop0op — このコンポーネント内部の対象 OP へのパス

Node View .nodeview 👁️

ノードビューア (Network エディタ上のサムネイル) に表示する内容を決定

項目	内部名	説明
Default Viewer	.default	コンポーネントタイプ標準のビューアを表示
Operator Viewer	.opviewer	指定した任意 OP のノードビューアを表示

Operator Viewer .opviewer 🖼️

Operator Viewer モード時に表示する対象 OP:

• Operator Viewer パス: Node View が opviewer モードのとき、そのビューア内容として表示する OP のパス

Cloning .cloning 🧬

マスター COMP の内容を複製する Cloning 設定:

• Enable Cloning: enablecloning — Clone Master の内容を継続的に複製するかを切替
• Enable Cloning Pulse: enablecloningpulse — その瞬間だけ Clone Master の内容を瞬時に複製
• Clone Master: clone — 複製元となるマスターコンポーネントへのパス

Load on Demand .loadondemand ⏳

必要時のみメモリにロードする遅延ロード設定:

• Load on Demand: オンの場合、このコンポーネントは実際に必要となるまでメモリにロードされない (起動時間・メモリ消費の最適化)

External .tox .externaltox 💾

外部 .tox ファイルとの連携設定:

• Enable External .tox: enableexternaltox — 起動時に外部 .tox ファイルからロード
• Enable External .tox Pulse: enableexternaltoxpulse — 外部 .tox ファイルから即時リロード
• External .tox Path: externaltox — ディスク上の .tox ファイルへのパス
• Reload Custom Parameters: reloadcustom — コンポーネントのカスタムパラメータ値を再読み込み
• Reload Built-In Parameters: reloadbuiltin — コンポーネントの組み込みパラメータ値を再読み込み
• Save Backup of External: savebackup — .toe ファイル内に外部 .tox のバックアップコピーを保存
• Sub-Component to Load: subcompname — .tox 内部の特定 COMP のみを取り出してロード

Relative File Path Behavior .relpath 📁

このコンポーネント内部での相対ファイルパスの解決基準

項目	内部名	説明
Use Parent’s Behavior	.inherit	親コンポーネントの設定を継承
Relative to Project File (.toe)	.project	.toe プロジェクトファイルからの相対パスとして解決
Relative to External COMP File (.tox)	.externaltox	外部 .tox ファイルからの相対パスとして解決

Parameter Color Space .parmcolorspace 🎨

このコンポーネント内の色パラメータをどの色空間として解釈するか

項目	内部名	説明
sRGB	.srgb	標準的な sRGB ガンマ空間
sRGB – Linear	.srgblinear	sRGB プライマリでガンマ線形 (1.0)
Rec.601 (NTSC)	.rec601ntsc	Rec.601 NTSC 規格の色空間
Rec.709	.rec709	HDTV 用 Rec.709 色空間
Rec.2020	.rec2020	UHDTV / HDR 向け Rec.2020 広色域
DCI-P3	.dcip3	デジタルシネマ DCI-P3 色空間
DCI-P3 (D60)	.dcip3d60	D60 白点 DCI-P3
Display-P3 (D65)	.displayp3d65	D65 白点 Display-P3 (Apple ディスプレイ等)
ACES2065-1	.aces2065-1	ACES アーカイブ用色空間 (AP0 プライマリ)
ACEScg	.acescg	ACES CG 作業用色空間 (AP1 プライマリ)
Passthrough	.passthrough	色変換を行わず値をそのまま扱う

Parameter Reference White .parmreferencewhite ⚪

色パラメータの基準白色の扱い

項目	内部名	説明
Default For Color Space	.default	選択した色空間のデフォルト基準白を使用
Use Parent Panel	.useparent	親パネルの基準白設定を継承
Standard (SDR)	.sdr	標準ダイナミックレンジ (SDR) 基準白
High (HDR)	.hdr	ハイダイナミックレンジ (HDR) 基準白
UI	.ui	UI 表示用の基準白

---

実践アイデア 💡

Example 1: ミニマップ・サムネイルの複製表示 🗺️

Container COMP (メインパネル) → Select COMP (Select Panel=/ui/main, Match Size=オフ, 小さく配置) → Network 右下にミニマップとして描画

メイン UI として運用している Container COMP の内容を、別の Select COMP で参照することで画面の右下にミニマップやサムネイル風プレビューを置く基本パターン。Select COMP 側の Width / Height を小さく設定し、Match Size を オフ にしておけば縮小複製として機能する。

1. メインの Panel Component (例: /ui/main) を通常通り構築
2. Select COMP を配置し、Select Panel に /ui/main のパスを指定
3. Match Size を オフ にして Select COMP 自体の Width / Height を小さく設定 (例: 320 × 180)
4. Background TOP / Background Color で枠装飾を追加すればミニマップ風 UI が完成

Example 2: Match Size で参照先サイズに自動追従 📐

Panel COMP (任意サイズ変更可能) → Select COMP (Match Size=オン) → Select COMP の Width / Height が参照先の寸法に自動同期

参照元の Panel Component のサイズが動的に変わるケース (デザイン中の調整・レスポンシブ UI) で、Select COMP の Match Size を オン にすると常に参照先と同じ寸法で描画される。寸法を二重管理する必要がなくなり、複数の Select COMP で同じパネルを表示する際の同期コストがゼロになる。

• Select COMP を配置し、Select Panel に参照元のパスを指定
• Match Size を オン に設定
• 参照元 Panel COMP の Width / Height を変更すると Select COMP 側も自動追従
• 複数の Select COMP で同じ参照先を見ている場合、すべてが同じサイズに揃う

Example 3: Follow Selectionで最上位の寸法取得 🔗

Panel COMP → Select COMP (中間) → Select COMP (Follow Selection=オン) → 最上位の非 Select COMP の寸法を取得

Select COMP が更に別の Select COMP を参照するネスト構造で、寸法だけは「Select ではない最上位の Panel」から取りたい場合に Follow Selection を使う。これにより中間 Select の寸法上書きを無視し、本物のパネル本体の寸法に揃えられる。

1. 最上位の Panel COMP (本物のパネル) を構築
2. 中間 Select COMP を配置し、Select Panel で最上位 Panel COMP を参照
3. 末端 Select COMP を配置し、Select Panel で中間 Select COMP を参照
4. 末端 Select COMP の Match Size と Follow Selection を両方 オン にすると、寸法は最上位 Panel COMP のものに揃う

---

関連オペレータ 🔗

類似機能OP 🔍

• TODO

組み合わせ推奨OP 🔄

• Container COMP — 親階層として Select COMP を内包し、UI レイアウト構築に利用
• Window COMP — Select COMP 群を含むパネル階層を出力ウィンドウに表示
• Base COMP — Select COMP の参照元として汎用コンテナとしても利用可

前処理・後処理COMP 🎯

• 前処理: Container COMP、Base COMP
• 後処理: Container COMP、Window COMP

---

Info COMP情報 📊

Select COMP は Info CHOP / Info DAT による詳細情報取得に対応しています。

COMP 固有情報 📦

• num_children: コンポーネント内部の子 OP の総数
• num_dats: 内部 DAT の数
• num_chops: 内部 CHOP の数
• num_tops: 内部 TOP の数
• num_sops: 内部 SOP の数

汎用オペレータ情報 🔄

• total_cooks: プロセス開始からのクック回数
• cook_time: 最後のクック時間 (ミリ秒)
• cook_frame: 最後にクックされたフレーム番号
• warnings: 警告数
• errors: エラー数
• cook_abs_frame: 絶対時間基準でのクックフレーム番号
• cook_start_time: オペレータがクックを開始した時刻
• cook_end_time: クックが完了した時刻
• cooked_this_frame: 現在のフレームでクックされた場合は 1

---

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

よくある問題と解決策 🔧

❌ Problem: Select COMP に参照先パネルの内容が表示されない
✅ Solution:

• Select Panel パラメータに正しい Panel Component のパスが入っているか確認 (タイポ・相対パスのスコープミスに注意)
• 参照先 Panel COMP の Display パラメータがオンになっているか確認
• Enable パラメータがオンか、Click Through が誤ってオンになっていないかを確認

❌ Problem: Select COMP のサイズが意図したものにならない
✅ Solution:

• Match Size を オン にしている場合、参照先 Panel COMP の Width / Height で寸法が決まるため、参照先側で調整
• Match Size を オフ にして Select COMP 自身の Width / Height を直接指定
• Select COMP が更に別の Select COMP を参照しているネスト構造では Follow Selection を オン にして最上位パネルの寸法を取得

❌ Problem: Background Color / Opacity が反映されない
✅ Solution:

• Background Alpha がゼロになっていないか確認 (アルファ 0 では Background Color が透明扱い)
• Multiply RGB by Alpha がオンの場合、RGB が事前にアルファ乗算されている点を踏まえて値を調整
• Composite の合成方式が Over 以外になっていないか確認 (Add / Multiply 等では見た目が変わる)

❌ Problem: クリックが参照先パネルに届かない
✅ Solution:

• Click Through を オフ にして Select COMP 自体がクリックを受ける状態に戻す
• 親階層のいずれかのパネルが Click Through を有効にしていないかを確認
• Mouse UV Buttons のチェックが目的のボタンで有効になっているか確認

---

参考資料 📚

その他 🔗

• TouchDesigner Wiki — COMP 概要
• TouchDesigner Wiki — Category:COMPs
• TouchDesigner Wiki — Category:Components
• TouchDesigner Wiki ホーム
• TouchDesigner 公式 Forum
• Facebook — TouchDesigner Help Group

公式リソース 📖

• TouchDesigner公式ドキュメント – Select COMP
• TouchDesigner公式ドキュメント – Panel Component
• TouchDesigner公式ドキュメント – Panel Values

その他の記事はこちら

---