よつばゲームズ

Bezier Path(ベジェパス)

インタラクティブエディタでベジェ曲線パスを定義。各セグメントを入出力ピン化して外部制御が可能。

中級
Since P00

出力ポート

Path(パス)

ベジェ曲線パスデータ

Path
Count(セグメント数)

パス内のセグメント数

Int

パラメータ

名前型デフォルト説明
Width幅Int64キャンバスの幅（ピクセル）
Height高さInt64キャンバスの高さ（ピクセル）
Path DataパスデータCustomData""ベジェパスJSONデータ（エディタが管理）
Segmentsセグメント数Int0セグメント数（エディタが自動管理）
Seg Nセグメント NMap""各セグメントのMap（📌入力/📤出力ピン化可能）

エディタ機能

ツールバー

ツールアイコン説明
フリー🔀制御点の移動 + 末尾追加 + 曲線上分割の統合ツール
追加➕新しい制御点をクリックで追加
移動✋制御点をドラッグで移動
削除❌アンカーをクリックで削除
選択⬚/〇/⬣範囲選択（ドロップダウンでモード切替）

範囲選択ツール（ドロップダウン）

モードアイコン操作
矩形選択⬚ドラッグで矩形範囲を作成
投げ縄選択〇ドラッグでフリーハンド範囲を作成
ポリゴン選択⬣クリックで頂点追加、ダブルクリックで確定

選択した制御点はドラッグで一括移動可能。Shift+クリックで個別追加、Shift+ドラッグで軸拘束。

その他のツールバー機能

  • 🔒/🔓 閉/開: パスを閉じる/開くトグル
  • #ON / #OFF: セグメント番号表示の切替
  • 💾 保存: 現在のパスを .pxpath ファイルに保存
  • 📂 読込: .pxpath ファイルからパスを読込
  • 🔍 N×: 現在のズーム倍率表示

ファイル保存/読込（.pxpath 形式）

パスデータを個別ファイルとして保存・読込できます。プロジェクト保存とは独立した機能です。

ファイル形式:

{
  "format": "PixPipelinePath",
  "version": 1,
  "type": "bezier",
  "data": { "segments": [...], "closed": false }
}

保存したファイルは、マルチパスエディタで新規レイヤーとしてインポート可能です。

キャンバス操作

  • ズーム: マウスホイール
  • パン: 中ボタンドラッグまたはスペース+ドラッグ
  • Shift+クリック: 16方向ピクセルスナップ
  • Ctrl+Z / Ctrl+Y: Undo / Redo

操作ヘルプ（エディタ下部）

各ツールの操作方法がエディタ下部に自動表示されます（日英対応）。

使用例

基本的な使い方

  1. ノードをダブルクリックしてエディタを開く
  2. 制御点をクリックしてパスを描く
  3. Path 出力を PathStroke や PathSample に接続

セグメント番号の確認

  1. エディタのツールバーで # ボタンをオンにする
  2. 各セグメントの中央に番号バッジが表示される
  3. SegmentUnpack で分解する際の参照に使用

セグメントの外部制御

  1. Inspector で seg_N の📤で出力ピン化
  2. SegmentUnpack ノードに接続して座標値を分解
  3. SineWave 等で座標値を加工
  4. SegmentPack ノードで再構成
  5. seg_N の📌で入力ピン化して外部セグメントを接続

パスの再利用

  1. エディタで💾ボタンをクリックしてパスを .pxpath に保存
  2. 別のノードや別プロジェクトで📂ボタンから読込
  3. マルチパスエディタに読込む場合は新規レイヤーとして追加される
ノード一覧に戻る
Bezier Path (ベジェパス) — PixPipeline ノード解説