Pixel Canvas
Generates an image. Pixel Canvas creates an image output for use in the node graph.
intermediate
Since P00
Input Ports
Reference
参照レイヤー（オプション）
Output Ports
Image
描画したドット絵
Parameters
| Name | Type | Default | Description |
|---|---|---|---|
| Width | Int | 32 | キャンバスWidth |
| Height | Int | 32 | キャンバスHeight |
| ピクセルデータ | CustomData | (空) | base64 PNG（エディタ管理、非表示） |
キャンバスサイズ連動
ジェネレータノードとして、新規作成時に width / height がプロジェクトのキャンバスサイズ（_canvasWidth / _canvasHeight）に自動バインドされます。
| 状態 | width/height の値 |
|---|---|
| default（新規作成時） | プロジェクトキャンバスサイズにバインド（自動追従） |
| ユーザーが手入力 or バインド解除 | ローカル値（キャンバスサイズと独立） |
インスペクターの 🔗 ボタンからバインドの解除・再登録ができます。
描画エディタ
インスペクターの「✏️ ドット絵を編集」ボタンを押すと、ポップアップモーダルで描画エディタが開きます。
ツール
| ツール | 動作 |
|---|---|
| ✏️ ペン | 1px 描画（ドラッグで連続描画） |
| 🧹 消しゴム | ピクセルを透明にする |
| 🪣 塗りつぶし | 4方向フラッドフィル |
| 💉 スポイト | クリック位置のColorを取得 |
操作
- マウスホイール: ズーム（1〜32倍）
- Alt+ドラッグ: パン
- ESC: エディタを閉じる
技術詳細
- 描画データは base64 PNG として CustomData パラメータに保存
- プロジェクト保存/読込で自動保持
- ズーム4倍以上でピクセルグリッド表示
- debounce（150ms）でパフォーマンス最適化
💡 Tips
- •描画データは base64 PNG として CustomData パラメータに保存
- •プロジェクト保存/読込で自動保持
- •ズーム4倍以上でピクセルグリッド表示
- •debounce（150ms）でパフォーマンス最適化