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

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

Line Thick SOP の線に幅をつけて帯状サーフェスを生成する機能を示す図

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

概要 📖 – 線に幅をつけて帯状に

Line Thick SOPは、入力された線や曲線に沿って幅 (太さ) を持つ帯状サーフェスを生成する SOPです。始点 (Start Width) と終点 (End Width) で太さを別々に指定できるため、均一なリボンから先細りのテーパー形状まで、線を面として見せるさまざまな表現に活用されます。

主な用途 🎯

  • 細い線を見える太さの帯状サーフェスに変換し、ワイヤーフレームのままでは描画されにくい線分をリボン・帯として可視化
  • 始点と終点で太さを変えたテーパー形状の生成で、筆のかすれ・葉脈・尻すぼみのストロークなど先細りの帯を 1 ノードから作成
  • 曲線に沿ったリボン・帯状ジオメトリの構築として、カーブの内側と外側それぞれの幅を独立指定して川・道路・トレイル状のサーフェスを生成
  • 手書き風ライン・ブラシストロークの太さ表現として、線の各区間に異なる太さを与えて筆圧のあるストロークを再現
  • テクスチャを貼れる面を持つラインアートの素材として、Divisions と Rows で分割したサーフェスに UV を載せてグラフィックス表現に活用
  • 軌跡・トレイルの帯状可視化として、パーティクルや頂点の移動経路を太さのあるリボンとして表示し、動きの流れを強調

データフロー 🔄

入力: 線・曲線ジオメトリ (Point の並び)

Start Width / End Width で始点と終点の太さを指定 + Shape で太さの補間カーブを選択 + Divisions / Rows で分割数を決定

出力: 入力線に沿って幅を持つ帯状サーフェスジオメトリ

Tips

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

まる。
まる。

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


パラメータ解説 ⚙️

Page 📁

対象グループ .group 🎯

入力ジオメトリのうち、どの部分に太さを付ける処理を適用するかを絞り込むパラメータ

Group .group 🎯
Group (対象グループ) — 入力にグループが存在する場合、ここにグループ名を指定すると、そのグループに含まれる部分にのみ太さ付け処理を適用
– パターン指定に対応 (空欄なら入力全体が対象)

始点と終点の幅 .widths 📏

生成される帯状サーフェスの太さを、線の始点側と終点側で別々に指定するパラメータ群。それぞれ曲線の内側と外側の幅を独立に調整できる

Start Width .startwidth 🟢
Start Width (始点幅) — 線の始まり側に作られる面の幅を指定
Startwidth1 は曲線の内側の幅、Startwidth2 は曲線の外側の幅を調整し、内外で異なる太さの帯を作れる

End Width .endwidth 🔴
End Width (終点幅) — 線の終わり側に作られる面の幅を指定
Endwidth1 は曲線の内側の幅、Endwidth2 は曲線の外側の幅を調整
Start Width と異なる値にするとテーパー (先細り) 形状になる

分割数 .divisions 🔢

生成されるサーフェスをどれだけ細かく分割するかを指定するパラメータ。分割数を上げるほど曲げやテクスチャの精度が向上する

Divisions .divisions 🔢
Divisions (分割数・列) — 生成されるサーフェスジオメトリの列方向 (Columns) の分割数
– 値を大きくすると太さ方向の解像度が上がり、後段での変形やテクスチャ表示が滑らかになる

Rows .rows 📊
Rows (行) — 生成されるサーフェスジオメトリの行方向 (Rows) の数
– 線に沿った方向の分割数で、曲線に沿った滑らかな帯を作るには十分な値が必要

適用範囲と形状 .domain_shape 🎚️

入力線のどの区間を使うか (Domain) と、始点幅から終点幅への太さの変化カーブ (Shape) を指定するパラメータ群

Domain .domain 📐
Domain (適用範囲) — 入力曲線のうち新しいサーフェスを作る区間の割合を指定
Domain1 は Start Width を置く曲線上の位置、Domain2 は End Width を置く位置を決める

太さの補間カーブ .shape 📈

始点の幅 (Start Width) から終点の幅 (End Width) へ太さが変化する際の補間の仕方を選ぶメニューパラメータ

項目 内部名 説明
Linear .linear 直線的に一定割合で太さが変化 (線形補間)
Ease In .easein 始めはゆっくり、後半で急に太さが変化 (始点側がなめらか)
Ease Out .easeout 始めは急に、後半でゆっくり太さが変化 (終点側がなめらか)
Ease .ease 始点と終点の両端がなめらかで、中間で大きく変化 (S 字状)
Cubic .cubic 3 次曲線による補間で、より滑らかな太さの変化

左右対称化 .symmetric 🔄

太さの付き方を曲線を中心に左右対称にするかどうかを切り替えるパラメータ

Symmetric .symmetric 🔄
Symmetric (左右対称) — オンにすると End Width が Domain1Domain2中間点に配置され、Start Width が Domain1Domain2 に置かれる
– 結果として曲線を中心に左右対称の帯状サーフェスが生成される


実践アイデア 💡

Example 1: 線を帯に変える 🎗️

Line SOP → Line Thick SOP (Start/End Width 指定) → Material SOP → Geometry COMP → Render TOP

Line SOP で作った 1 本の細い直線を Line Thick SOP に通し、Start Width と End Width に同じ値を設定すると、線が均一な幅を持つ帯状サーフェスに変わります。ワイヤーフレームのままでは見えにくい線分も、面として描画できるようになりレンダリング結果に確実に映る、もっとも基本的な使い方です。

  1. Line SOP を作成し、Point A から Point B へ直線を引く
  2. Number of Points16 程度に増やして後段での曲げ・テクスチャに備える
  3. Line Thick SOP を接続し、Start WidthEnd Width に同じ値 (例 0.1) を設定して均一な帯にする
  4. Material SOP で色・質感を整え、Geometry COMP / Render TOP に流して可視化

Example 2: 筆風テーパー ✍️

Line SOP → Line Thick SOP (Start Width 大 / End Width 小 + Shape=Ease) → Material SOP → Render TOP

Start Width を大きめ、End Width を小さめに設定し、Shape を Ease にすると、始点が太く終点に向かって滑らかに細くなる筆のかすれのようなテーパー形状が作れます。手書き風のラインアートやブラシストローク表現で、線に筆圧のニュアンスを与えたいときに頻出するパターンです。

  1. Line SOP で曲線または直線を作成し、Number of Points32 以上に増やす
  2. Line Thick SOP を接続し、Start Width0.2End Width0.02 に設定して先細りにする
  3. ShapeEase に変更して太さの変化を滑らかにする
  4. DivisionsRows を上げて曲線に沿った滑らかさを確保
  5. Material SOP でブラシ風のテクスチャを貼り、Render TOP に流す

Example 3: 軌跡をリボン化 🌊

Trail SOP (頂点の移動履歴) → Line Thick SOP → Material SOP → Geometry COMP

Trail SOP で頂点の移動履歴を線として書き出し、その線を Line Thick SOP に渡すと、動きの軌跡が太さのあるリボン状サーフェスとして可視化されます。パーティクルや踊るような頂点の流れを、ただの細い線ではなく面のある帯として見せたいときに使う、モーショングラフィックス向けの構築フローです。

  1. 動かしたいジオメトリの出力を Trail SOP に接続し、頂点の移動履歴を線として蓄積
  2. Line Thick SOP を接続し、Start Width / End Width でリボンの太さを指定
  3. Shape で軌跡の先頭から末尾への太さ変化を選び、流れの強弱を表現
  4. Material SOP で半透明・グラデーション質感を載せ、Geometry COMP に組込んで Render TOP に流す

関連オペレータ 🔗

類似機能OP 🔍

  • Line SOP — 2 点を結ぶ直線を生成 (Line が幅のない線、Line Thick がそれに太さを付ける)
  • Sweep SOP — 断面プロファイルを線に沿って押し出し (Line Thick が幅指定の帯、Sweep が任意断面の押し出し)
  • Wireframe SOP — エッジを円柱状のワイヤーに変換 (Line Thick が平らな帯、Wireframe が立体的なパイプ)
  • Tube SOP — 円筒・円錐プリミティブを生成 (太さのある形状を作る点で関連)

組み合わせ推奨OP 🔄

  • Line SOP — 前段で線を生成し、Line Thick で太さを付ける基本ペア
  • Carve SOP — 太さを付ける前に線の一部区間だけを切り出す
  • Resample SOP — 前段で頂点を等間隔リサンプリングして帯の滑らかさを整える
  • Transform SOP — Line Thick 出力後の帯サーフェスを移動・回転・スケール
  • Copy SOP — 太さを付けた帯を多数コピー・分散配置してパターンを生成

前処理・後処理SOP 🎯


Info CHOP情報 📊

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

ジオメトリ統計 📐

  • num_points: この SOP に含まれるポイント数
  • num_prims: この SOP に含まれるプリミティブ数
  • num_particles: この SOP に含まれるパーティクル数

GPU 転送タイミング 🎮

  • last_vbo_update_time: 別スレッドで SOP の CPU データを GPU 上のジオメトリデータに更新するのにかかった時間 (フレーム時間外)
  • last_meta_vbo_update_time: 別スレッドで metaball や NURBS のようなメタサーフェスジオメトリデータを GPU に更新するのにかかった時間 (フレーム時間外)

汎用オペレータ情報 🔄

  • total_cooks: プロセス開始以降にこのオペレータがクックされた合計回数
  • cook_time: 直近のクック所要時間 (ミリ秒)
  • cook_frame: このオペレータが最後にクックされたフレーム番号
  • warnings: このオペレータの警告数
  • errors: このオペレータのエラー数

クック統計 ⏱️

  • total_cooks: total_cooks — プロセス開始以降にこのオペレータがクックされた合計回数
  • cook_time: cook_time — 直近のクック所要時間 (ミリ秒)
  • cook_frame: cook_frame — このオペレータが最後にクックされたフレーム番号
  • cooked_this_frame: cooked_this_frame — 当該フレームでクックされた場合は 1

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

よくある問題と解決策 🔧

❌ Problem: 帯が表示されない・線のまま
✅ Solution:

  • Start WidthEnd Width0 になっていないか確認 (幅が 0 だと面が作られず線のまま)
  • 入力に有効な線・曲線ジオメトリが接続されているか確認 (頂点が 2 点未満だと面が生成されない)
  • 出力を Geometry COMP に接続して Render TOP でレンダリングしているか確認

❌ Problem: テーパーがうまく効かない
✅ Solution:

  • Start WidthEnd Width に異なる値を設定しているか確認 (同じ値だと均一な帯になる)
  • ShapeLinear 以外 (Ease / Cubic 等) に変えて太さの変化カーブを調整
  • 前段で Resample SOP を入れて頂点を等間隔にし、太さ変化を滑らかにする

❌ Problem: 帯がカクカクして滑らかでない
✅ Solution:

  • DivisionsRows の値が小さいと分割が粗くなるため値を上げる
  • 入力線の頂点数が少ない場合は前段の Line SOP の Number of Points を増やすか Resample SOP で頂点を追加
  • 曲線に沿った滑らかさが欲しい場合は Rows を十分に確保する

❌ Problem: 太さの付き方が左右非対称になる
✅ Solution:

  • Symmetric をオンにすると曲線を中心に左右対称の帯が生成される
  • 曲線の内側と外側で別々の太さにしたい場合は Startwidth1 / Startwidth2 (および End 側) を個別に調整
  • Domain1 / Domain2 の位置がずれていないか確認して幅の配置位置を整える

参考資料 📚

その他 🔗

公式リソース 📖

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