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

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

Video Stream In TOP のネットワーク映像取り込み機能を示す図

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

概要 📖 – ネット映像を取り込む

Video Stream In TOPは、指定した URL のネットワーク映像ストリームを受信し、テクスチャとして出力する TOPです。RTSP・HLS・SRT サーバーや WebRTC ピアを入力源として、ネットワーク経由の映像をリアルタイムに取り込みます。

主な用途 🎯

  • RTSP カメラ (ネットワークカメラ) 映像のリアルタイム取り込み
  • HLS / SRT 配信ストリームの受信と合成素材化
  • WebRTC ピア接続によるブラウザ間映像の取り込み
  • 遠隔地カメラ映像を使ったライブビジュアル演出
  • 監視カメラ映像のリアルタイム解析・エフェクト処理

データフロー 🔄

入力: ネットワーク経由の映像ストリーム (RTSP / HLS / SRT / WebRTC)

デコード・バッファリング処理

出力: テクスチャ (TOP 画像)

Tips

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

まる。
まる。

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


パラメータ解説 ⚙️

Play Page ▶️

再生制御 .play 🎬

Active .active 🔘
Active (有効化) — 1 に設定すると、指定した URL の映像ストリームの取り込みを開始します。
– オフのあいだはストリームへ接続せず、テクスチャ出力も更新されません。

Server URL .url 🔗
Server URL (ストリームの URL) — 受信する映像ストリームのアドレスを指定します。
– RTSP・HLS・SRT サーバーのアドレス形式は公式概要 (Summary) の記載に従います。

Reload .reload 🔄
Reload (再読み込み) — 接続を一度切ってストリームへ再接続を試みます。
– 接続が不安定になったときの復帰手段として使います。

Reload Pulse .reloadpulse
Reload Pulse (再読み込みボタン) — ボタンを離した瞬間に再読み込みを即座に実行します。
– Python からは pulse() メソッドで呼び出せます。

Play .play ⏯️
Play (再生) — オンのあいだストリームを前方再生し、オフにすると一時停止します。

Force Re-buffer .forcerebuffer ♻️
Force Re-buffer (強制再バッファ) — 可能な場合にストリームを強制的に再バッファリングします。

入力ソース選択 .mode 🎛️

Mode (入力ソース) — 映像の取得元を選択するメニューパラメータ。

項目 内部名 説明
Server .server RTSP・HLS・SRT サーバーを入力源として使用
WebRTC .webrtc WebRTC ピアを入力源として使用

Image Page 🖼️

インターレース解除 .deinterlace 📺

Deinterlace (インターレース解除) — フィールド単位で保存された映像を 1 枚の画像に変換する方式を選択します。

項目 内部名 説明
Off .off 画像を変換せずそのまま出力
Even .even 偶数走査線だけを使い、奇数走査線は補間で生成
Odd .odd 奇数走査線だけを使い、偶数走査線は補間で生成
Bob (Split) .bob 偶数画像と奇数画像を順に出力し、時間的な滑らかさを最優先

フィールド優先順位 .precedence 🔀

Field Precedence (フィールド優先順位) — フィールドを 1 枚ずつ取り出す際に、どちらのフィールドを先に取り出すかを選択します。

項目 内部名 説明
Even .even 偶数フィールドを先に取り出す (既定)
Odd .odd 奇数フィールドを先に取り出す

アルファ埋め込み .bottomhalfalpha 🪟

Bottom Half is Alpha (AAA) .bottomhalfalpha 🪟
Bottom Half is Alpha (AAA) (下半分をアルファに) — H.264 などアルファ非対応の形式へアルファを埋め込む方式です。
– 画像の下半分にアルファ (RGB=AAA) を入れて作成しておき、本機能をオンにすると下半分を出力のアルファチャンネルへ移します。画像の高さは半分になります。


Tune Page ⚙️

バッファ設定 .buffer 🧮

Pre-Read Frames .prereadframes
Pre-Read Frames (先読みフレーム数) — TouchDesigner が先読みしてメモリに蓄える映像フレーム数を指定します。
– 先読みにより、ディスク断片化があっても映像ストリームの滑らかな読み込みが可能になります。

Video Buffer Frames .videobufferframes 📦
Video Buffer Frames (映像バッファフレーム数) — 先読みしてメモリに蓄える映像フレーム数を指定します。
– 断片化したファイルや他リソースのディスクアクセスによる映像のカクつき (pop / stutter) を抑えます。

Disable Buffering .disablebuffering 🚫
Disable Buffering (バッファ無効化) — バッファリング処理を無効にします。

ネットワーク設定 .network 🌐

Network Buffer Size (KB) .networkbuffersize 📥
Network Buffer Size (KB) (ネットワーク入力バッファ容量) — ネットワーク入力バッファの大きさをキロバイト単位で指定します。

Network Queue Size (4KB Each) .networkqueuesize 📚
Network Queue Size (4KB Each) (ネットワークキュー数) — ネットワークキューへ割り当てる 4KB 単位のチャンク数を指定します。
– ネットワーク入力バッファから読み出した後に保持されるデータ量です。

デコード設定 .decode 🧩

Max Decode CPUs .maxdecodecpus 🖥️
Max Decode CPUs (最大デコード CPU 数) — H264 など複数 CPU でのデコードに対応したコーデックで使用する CPU の上限を制限します。

Hardware Decode .hwdecode 🟢
Hardware Decode (ハードウェアデコード) — Nvidia GPU でのハードウェアデコードを有効にします。


WebRTC Page 🛰️

WebRTC 接続 .webrtc 🛰️

WebRTC DAT .webrtc 📡
WebRTC DAT (WebRTC ピア指定) — 映像ストリームを取得する WebRTC DAT (ピア) を設定します。
– 設定すると WebRTC Connection の候補メニューが自動で埋まります。

WebRTC Connection .webrtcconnection 🔗
WebRTC Connection (WebRTC 接続) — WebRTC のピア間接続を選択します。
– 選択すると WebRTC Track の候補メニューが自動で埋まります。

WebRTC Track .webrtctrack 🎞️
WebRTC Track (映像トラック) — WebRTC のピア間接続に含まれる映像入力トラックを選択します。


実践アイデア 💡

Example 1: ネットワークカメラ映像の合成 📹

Video Stream In TOP (RTSP) → Level TOP → Composite TOP

RTSP 対応のネットワークカメラ映像を Video Stream In TOP で受信し、Level TOP で明るさを整えてから Composite TOP で他の素材と重ね合わせる基本フローです。遠隔地のカメラ映像をリアルタイム演出に取り込めます。

  1. Video Stream In TOP の Server URL に RTSP カメラのアドレスを入力
  2. Mode を Server に設定し Active と Play をオンにして映像を受信
  3. Level TOP で明るさ・コントラストを調整
  4. Composite TOP で背景素材と重ね合わせて出力

Example 2: WebRTC 映像の取り込み 🛰️

WebRTC DAT → Video Stream In TOP (WebRTC) → Null TOP

WebRTC DAT で確立したピア接続から映像トラックを Video Stream In TOP に取り込み、Null TOP を経由して後段に渡す例です。ブラウザ側のカメラ映像を低遅延で TouchDesigner に取り込めます。

  1. WebRTC DAT でピア接続を確立
  2. Video Stream In TOP の Mode を WebRTC に設定し WebRTC DAT を指定
  3. WebRTC Connection と WebRTC Track で受信する映像トラックを選択
  4. Null TOP を経由して後段の処理へ渡す

Example 3: 配信ストリームの安定受信 🎬

Video Stream In TOP (HLS/SRT) → Cache TOP

HLS や SRT で配信される映像ストリームを Video Stream In TOP で受信し、バッファ設定を調整してカクつきを抑える構成です。ネットワーク状況が不安定でも滑らかな再生を目指します。

  1. Server URL に HLS / SRT ストリームのアドレスを入力
  2. Video Buffer Frames と Network Buffer Size を増やしてバッファを確保
  3. Hardware Decode を有効にして GPU デコードで負荷を下げる

関連オペレータ 🔗

類似機能OP 🔍

  • Movie File In TOP — ローカルファイルや一部 URL から映像を読み込む
  • NDI In TOP — 同一 LAN 内の NDI 映像ソースを受信
  • Video Device In TOP — ローカル接続のキャプチャ機器から映像を取得

組み合わせ推奨OP 🔄

  • Level TOP — 受信映像の明るさ・コントラストを補正
  • Composite TOP — 受信映像を他の素材と重ね合わせて合成
  • Null TOP — 中継点として後段に映像を渡す
  • Video Stream Out TOP — 処理した映像をネットワークへ再配信

前処理・後処理TOP 🎯


Info情報 📊

Video Stream In TOP は TOP 共通の情報取得に対応しています。

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

解像度情報 📐

  • width / height: 受信している映像テクスチャの幅と高さ (ピクセル)
  • aspect: 映像のアスペクト比

ストリーム状態 📶

  • 接続状態: ストリームへの接続が確立しているかどうかの状態
  • バッファ状況: 先読みフレームやネットワークバッファの蓄積状況

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

よくある問題と解決策 🔧

❌ Problem: 映像が表示されない
✅ Solution:

  • ActivePlay が両方オンになっているか確認
  • Server URL のアドレス形式が公式概要の記載どおりか確認
  • Reload を押してストリームへ再接続を試す

❌ Problem: 映像がカクつく・止まる
✅ Solution:

  • Video Buffer FramesNetwork Buffer Size (KB) を増やしてバッファを確保
  • Hardware Decode を有効にして GPU デコードで負荷を下げる
  • 後段に Cache TOP を入れて再生を安定化

❌ Problem: WebRTC で映像が来ない
✅ Solution:

  • WebRTC DAT でピア接続が確立しているか確認
  • WebRTC ConnectionWebRTC Track で正しい映像トラックを選択しているか確認
  • Mode が WebRTC に設定されているか確認

参考資料 📚

その他 🔗

公式リソース 📖

関連オペレータ 🔗

この記事は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をコピーしました