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

※当サイトにはプロモーションリンクが含まれます。

OP Viewer TOP が他オペレータのビューア表示をテクスチャ化する図

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

概要 📖 – 他オペレータの表示を画像化

OP Viewer TOPは、指定したオペレータのビューア表示をそのままテクスチャとして取り込む TOPです。対象オペレータをパスで指定するだけで、その見た目を 1 枚の画像として後段の合成や出力に渡せます。

主な用途 🎯

  • 他オペレータのビューア表示をそのままテクスチャとして取り込む
  • ネットワークエディタの見た目を画面内に埋め込んで可視化する
  • パネル付きコンポーネントの表示を 1 枚の画像にまとめる
  • UI やダッシュボードの一部を別画面へ複製表示する
  • 制作中のオペレータの状態を後段の合成や録画へ流し込む

データフロー 🔄

入力: 表示したいオペレータのパス指定
 ↓
OP Viewer TOP (対象のビューア表示をテクスチャ化)
 ↓
出力: 下流 TOP・合成・録画へ渡せる画像

Tips

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

まる。
まる。

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

パラメータ解説 ⚙️

OP Viewer Page 📋

Operator Viewer .opviewer 🎯

表示を取り込む対象オペレータの指定:

  • Operator Viewer: Operator Viewer (表示元オペレータ) — どのオペレータのビューアを画像化するかを指定します。対象オペレータをこのパラメータにドラッグ&ドロップするか、パスを直接入力します。

表示オプション 🖼️

Allow Panel Interaction .allowpanel 🖱️
– Allow Panel Interaction (パネル操作の許可) — 取り込んだパネルへのマウス操作を許可する設定です。
– 公式ドキュメントで廃止予定とされており、代替として OP Viewer COMP の利用が案内されています。

Preserve Alpha .preservealpha 🎨
– Preserve Alpha (アルファの保持) — テクスチャの透明度をアルファチャンネルで決定します。
– オンにすると取り込んだ画像の透過情報がそのまま後段へ引き継がれます。

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 倍
Custom Resolution .custom Resolution パラメータで任意指定

Resolution .resolution 📐

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

  • Resolution W: 出力幅 (ピクセル単位)。Output Resolution が Custom 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: Project Settings の Global Resolution Multiplier をこの TOP に適用するかどうか。プロトタイプを低解像度で動かしつつ最終出力で一括フル解像度化する運用に便利

Output Aspect .outputaspect 📏

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

項目 内部名 説明
Use Input .useinput 入力 TOP のアスペクトを継承
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 アスペクト保持で外側まで覆う最小サイズ (はみ出しあり)

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 各チャンネルのオン/オフトグル。オフのチャンネルは 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・中間処理向け)
32-bit float (RGBA) .rgba32float 32 ビット浮動小数 RGBA (最高精度、メモリ大)
10-bit RGB with 2-bit Alpha .rgb10a2fixed 10-10-10-2 ビット固定小数 (バンディング抑制)
16-bit fixed (RGBA) .rgba16fixed 16 ビット固定小数 RGBA
11-bit float (RGB) .rgb11float 11-11-10 ビット浮動小数 RGB (アルファなし、HDR 軽量)
16-bit float (RGB) .rgb16float 16 ビット浮動小数 RGB (アルファなし)
32-bit float (RGB) .rgb32float 32 ビット浮動小数 RGB (アルファなし)
8-bit fixed (Mono) .mono8fixed 8 ビット固定小数モノクロ
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 チャンネル
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: ノード表示を埋込 🖼️

OP Viewer TOP (対象に Geometry COMP を指定) → Composite TOP → Out TOP

確認したいコンポーネントやオペレータのパスを OP Viewer TOP に指定し、そのビューア表示をテクスチャとして取り込む構成です。取り込んだ画像を Composite TOP で他の映像と重ねれば、制作中のオペレータの状態を最終画面の一部として表示できます。

  1. OP Viewer TOP を配置し、Operator Viewer パラメータに表示したいオペレータをドラッグ&ドロップ
  2. Fill Viewer や Output Resolution で表示サイズと収まり方を調整
  3. 出力を Composite TOP に渡し、背景や他のレイヤーと合成
  4. Out TOP へ送って最終出力やプレビュー画面に反映

Example 2: 別画面へ複製表示 📺

OP Viewer TOP (対象に Container COMP を指定) → Null TOP → Video Device Out TOP

UI を組んだコンポーネントの表示を OP Viewer TOP で画像化し、別のモニタや外部出力へ複製表示する構成です。元の UI をそのまま映せるため、操作用画面と観客向け画面を分けたいインスタレーションやライブ演出で役立ちます。

  1. OP Viewer TOP の Operator Viewer に複製したいコンポーネントを指定
  2. Preserve Alpha を必要に応じてオンにし、透過を保ったまま取り込む
  3. Null TOP を挟んで参照先を固定してから外部出力へ分岐
  4. Video Device Out TOP 等で別モニタや配信先へ送出

関連オペレータ 🔗

類似機能OP 🔍

  • OP Viewer COMP — パネル操作も扱える後継。インタラクションが必要な場合の推奨代替
  • Render TOP — 3D シーンを描画して画像化する点が異なる表示系 TOP

組み合わせ推奨OP 🔄

  • Composite TOP — 取り込んだビューア画像を他の映像と複数レイヤーで合成
  • Null TOP — 取り込んだ画像の参照先を固定して下流の配線を安定させる
  • Out TOP — 取り込んだ画像を Component の外部出力ポートとして公開

前処理・後処理TOP 🎯

Info CHOP情報 📊

OP Viewer 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: エラー数

TOP 共通情報 🖼️

  • resolutionx: 出力テクスチャの横ピクセル数
  • resolutiony: 出力テクスチャの縦ピクセル数
  • aspectx / aspecty: 出力テクスチャの横・縦アスペクト値
  • depth: 3D テクスチャの場合の深度。2D テクスチャでは 1
  • pixelformat: 出力テクスチャの内部ピクセルフォーマット番号

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

よくある問題と解決策 🔧

❌ Problem: 何も表示されない
✅ Solution:

  • Operator Viewer に正しいオペレータのパスが指定されているか確認します。空欄や存在しないパスでは何も取り込まれません。
  • 指定したオペレータがビューア表示を持つ種類か確認します。表示を持たないオペレータでは画像が出ません。
  • 対象オペレータがクックされて中身を出力しているか、ノード表示でエラー (赤枠) になっていないか確認します。

❌ Problem: 透過がうまく出ない
✅ Solution:

  • Preserve Alpha がオンになっているか確認します。オフだとアルファチャンネルの透明度が反映されません。
  • Pixel Format がアルファを持つフォーマット (RGBA 系) になっているか確認します。
  • 後段で Composite TOP に渡す際、合成モードがアルファを考慮する設定になっているか確認します。

❌ Problem: パネル操作ができない
✅ Solution:

  • Allow Panel Interaction は廃止予定のため、パネル操作が必要な場合は OP Viewer COMP を代替として使用します。
  • 操作対象のコンポーネントがパネルを持つ種類 (Container COMP 等) か確認します。
  • インタラクション込みで取り込みたい場合は、表示専用の OP Viewer TOP ではなく操作対応版の OP Viewer COMP に置き換えます。

参考資料 📚

その他 🔗

公式リソース 📖

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


まる。

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

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

↓日常垢
Instagram：＠malmal0v0

まる。をフォローする
その他の記事はこちら
Math Combine POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
ZED Select TOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
ZED POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
Window COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
Widget COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

タイトルとURLをコピーしました