LiteGraph
Comfy UI は LiteGraph を基に構築されています。
Comfy の機能の多くは LiteGraph によって提供されているため、より複雑なノードを開発する場合は、そのリポジトリをクローンし、doc/index.html にあるドキュメントを参照することをお勧めします。
ComfyApp
app オブジェクト（import { app } from "../../scripts/app.js"; で常にアクセス可能）は、ブラウザ上で実行されている Comfy アプリケーションを表し、以下にリストするものを含む、多くの有用なプロパティと関数を含んでいます。
非推奨： app 上の関数やプロトタイプをハイジャック/モンキーパッチすることは非推奨であり、近い将来いつでも変更される可能性があります。代わりに、公式の 拡張フック および コンテキストメニュー API を使用してください。 app 上の関数をハイジャックすることは推奨されません。Comfy は継続的に開発されており、コアの動作が変更される可能性があるためです。
プロパティ
app の重要なプロパティには以下が含まれます（完全なリストではありません）：
| プロパティ | 内容 |
|---|
canvas | 現在のユーザーインターフェースを表す LGraphCanvas オブジェクト。node_over や selected_nodes などの興味深いプロパティを含みます。 |
canvasEl | DOM <canvas> 要素 |
graph | 現在のグラフを記述する LGraph オブジェクトへの参照 |
runningNodeId | 実行中、現在実行されているノード |
ui | キュー、メニュー、ダイアログなどの一部の UI 要素へのアクセスを提供します |
canvas（グラフィカル要素用）と graph（論理接続用）は、おそらく最もアクセスしたいものでしょう。
同様に、関数も多数あります。以下にいくつかの重要なものを示します。
| 関数 | 備考 |
|---|
| graphToPrompt | グラフを Python サーバーに送信できるプロンプトに変換します |
| loadGraphData | グラフを読み込みます |
| queuePrompt | プロンプトをキューに送信します |
| registerExtension | 拡張機能を追加するために使用されます（既にご覧になっています） |
LGraph
LGraph オブジェクトは LiteGraph フレームワークの一部であり、グラフ（ノードとリンク）の現在の論理状態を表します。
グラフを操作したい場合は、LiteGraph ドキュメント（https://github.com/jagenjo/litegraph.js をクローンした場合 doc/index.html にあります）に必要な関数が説明されています。
graph を使用してノードとリンクの詳細を取得できます。例：
const ComfyNode_object_for_my_node = app.graph._nodes_by_id(my_node_id)
ComfyNode_object_for_my_node.inputs.forEach(input => {
const link_id = input.link;
if (link_id) {
const LLink_object = app.graph.links[link_id]
const id_of_upstream_node = LLink_object.origin_id
// など
}
});
LLink
LLink オブジェクトは graph.links を通じてアクセスでき、ノード link.origin_id の出力スロット link.origin_slot からノード link.target_id のスロット link.target_slot へのグラフ内の単一のリンクを表します。また、データ型を表す文字列 link.type と link.id も持ちます。
LLink は LGraphNode（ComfyNode はそのサブクラスです）の connect メソッドで作成されます。
独自の LLink オブジェクトを作成しないでください。代わりに LiteGraph の関数を使用してください。
ComfyNode
ComfyNode は LGraphNode のサブクラスであり、より一般的な操作については LiteGraph ドキュメントが役立ちます。ただし、Comfy は LiteGraph のコア動作を大幅に拡張しており、LiteGraph の機能のすべてを使用しているわけではありません。
以下の説明は通常のノードに適用されます。
グループノード、プリミティブノード、ノート、リダイレクトノードは異なるプロパティを持ちます。
ComfyNode オブジェクトは現在のワークフロー内のノードを表します。これには、利用したい多くの重要なプロパティ、および動作を変更するために使用またはハイジャックしたい非常に多くの関数があります。
非推奨： ComfyNode または LGraphNode 上のプロトタイプメソッドをハイジャックすることは非推奨であり、近い将来いつでも変更される可能性があります。利用可能な場合は、コンテキストメニュー用の getNodeMenuItems などの公式の 拡張フック を使用してください。例については コンテキストメニュー移行ガイド を参照してください。 console.log コマンドにブレークポイントを設定することをお勧めします。その後、新しいノードを作成すると、お気に入りのデバッガーを使用してノードを調べることができます。
async nodeCreated(node) {
console.log("nodeCreated")
}
プロパティ
| プロパティ | 内容 |
|---|
bgcolor | ノードの背景色。デフォルトの場合は undefined |
comfyClass | ノードを表す Python クラス |
flags | ノードの状態に関連するフラグを含む辞書。特に、flags.collapsed は折りたたまれたノードの場合 true です。 |
graph | LGraph オブジェクトへの参照 |
id | 一意の ID |
input_type | 入力タイプのリスト（例：“STRING”、“MODEL”、“CLIP” など）。一般的に Python の INPUT_TYPES と一致します |
inputs | 入力のリスト（後述） |
mode | 通常は 0。ノードがミュートされている場合は 2、バイパスされている場合は 4 に設定されます。1 と 3 の値は Comfy では使用されません |
order | 実行順序におけるノードの位置。プロンプトが送信されたときに LGraph.computeExecutionOrder() によって設定されます |
pos | キャンバス上のノードの [x,y] 位置 |
properties | LiteGraph によって使用される "Node name for S&R" を含む辞書 |
properties_info | properties 内のエントリのタイプとデフォルト値 |
size | キャンバス上のノードの幅と高さ |
title | 表示タイトル |
type | ノードクラスの一意の名前（Python から） |
widgets | ウィジェットのリスト（後述） |
widgets_values | ウィジェットの現在の値のリスト |
入力、出力、ウィジェット
| 関数 | 備考 |
|---|
| Inputs / Outputs | ほとんどが同等の名前の出力メソッドを持ちます：s/In/Out/ |
addInput | 名前とタイプで定義された新しい入力を作成します |
addInputs | addInput の配列バージョン |
findInputSlot | 入力名からスロットインデックスを検索します |
findInputSlotByType | タイプに一致する入力を検索します。空きスロットを優先、またはのみ使用するオプションがあります |
removeInput | スロットインデックスによる削除 |
getInputNode | この入力に接続されているノードを取得します。出力の同等物は getOutputNodes で、リストを返します |
getInputLink | この入力に接続されている LLink を取得します。出力の同等物はありません |
| Widgets | |
addWidget | 標準の Comfy ウィジェットを追加します |
addCustomWidget | カスタムウィジェットを追加します（getComfyWidgets フックで定義） |
addDOMWidget | DOM 要素によって定義されたウィジェットを追加します |
convertWidgetToInput | widgetInputs.js の isConvertableWidget によって許可されている場合、ウィジェットを入力に変換します |
| 関数 | 備考 |
|---|
connect | このノードの出力を他のノードの入力に接続します |
connectByType | タイプを指定して出力を他のノードに接続します - 利用可能な最初の一致するスロットに接続します |
connectByTypeOutput | タイプによって入力を他のノードの出力に接続します |
disconnectInput | 入力（名前またはインデックスで指定）へのリンクをすべて削除します |
disconnectOutput | 指定されたノードの入力から出力を切断します |
onConnectionChange | 各ノードで呼び出されます。このノードの入力であれば side==1 です |
onConnectInput | 接続が行われる前に呼び出されます。false を返すと、接続は拒否されます |
| 関数 | 備考 |
|---|
setDirtyCanvas | 前景（ノード）および/または背景（リンクと画像）の再描画が必要であることを指定します |
onDrawBackground | 背景を描画するための CanvasRenderingContext2D オブジェクトと共に呼び出されます。画像のレンダリングに Comfy によって使用されます |
onDrawForeground | ノードを描画するための CanvasRenderingContext2D オブジェクトと共に呼び出されます。 |
getTitle | 表示されるタイトル。 |
collapse | ノードの折りたたみ状態を切り替えます。 |
collapse は命名が不正確です。折りたたみ状態を「切り替え」ます。
node.collapsable === false をオーバーライドするために使用できるブール値パラメータを受け取ります。
その他
| 関数 | 備考 |
|---|
changeMode | ノードをバイパス（mode == 4）または非バイパス（mode == 0）に設定するために使用します |
入力とウィジェット
入力とウィジェットは、ノードにデータを送り込む 2 つの方法を表します。一般的に、ウィジェットは入力に変換できますが、すべての入力をウィジェットに変換できるわけではありません（多くのデータ型は UI 要素を通じて入力できないため）。
node.inputs は現在の入力のリスト（ノードの左側にある色の付いたドット）であり、.name、.type、および .link（app.graph.links 内の接続された LLink への参照）を指定します。
入力が変換されたウィジェットである場合、.widget に、現在非アクティブなウィジェットへの参照も保持されます。
node.widgets は、入力に変換されたかどうかにかかわらず、すべてのウィジェットのリストです。ウィジェットには以下があります：
| プロパティ/関数 | 備考 |
|---|
callback | ウィジェット値が変更されたときに呼び出される関数 |
last_y | ノード内のウィジェットの垂直位置 |
name | ウィジェット名（ノード内で一意） |
options | Python コードで指定された通り（デフォルト、最小値、最大値など） |
type | ウィジェットタイプの名前（下記参照）。小文字 |
value | 現在のウィジェット値。これは get および set メソッドを持つプロパティです |
ウィジェットタイプ
app.widgets は現在登録されているウィジェットタイプの辞書であり、タイプ名の大文字バージョンをキーとします。
Comfy 組み込みのウィジェットタイプには、自明な BOOLEAN、INT、FLOAT、
2 種類（単一行と多行）がある STRING、
リストからのドロップダウン選択用の COMBO、および画像読み込みノードで使用される IMAGEUPLOAD が含まれます。
拡張機能で getCustomWidgets メソッドを提供することで、カスタムウィジェットタイプを追加できます。
リンクされたウィジェット
ウィジェットもリンクできます。例えば、seed と control_after_generate の組み込み動作です。
リンクされたウィジェットは .type = 'base_widget_type:base_widget_name' を持ちます。したがって、control_after_generate は int:seed というタイプを持つ可能性があります。
プロンプト
Comfy で Queue Prompt ボタンを押すと、app.graphToPrompt() メソッドが呼び出され、現在のグラフがサーバーに送信できるプロンプトに変換されます。
app.graphToPrompt は、output と workflow の 2 つのプロパティを持つオブジェクト（以下 prompt と呼ぶ）を返します。
output
prompt.output は、グラフ内の各ノードの node_id から、2 つのプロパティを持つオブジェクトへのマップです。
prompt.output[node_id].class_type、Python コードで定義されたカスタムノードクラスの一意の名前prompt.output[node_id].inputs、各入力（またはウィジェット）の値を含み、入力名から以下へのマップです：
- ウィジェットの場合、選択された値
- 入力にリンクが接続されている場合、(
upstream_node_id, upstream_node_output_slot) を含む配列
- 入力に変換されたが接続されていないウィジェットの場合、undefined
- 他の接続されていない入力は
.inputs に含まれません
接続された入力を記述する配列内の upstream_node_id は、整数ではなく文字列として表されることに注意してください。
workflow
prompt.workflow には以下のプロパティが含まれます：
config - 追加の設定オプションの辞書（デフォルトでは空）extra - ワークフローに関する追加情報を含む辞書。デフォルトでは以下を含みます：
extra.ds - グラフの現在のビューを記述します（scale と offset）
groups - ワークフロー内のすべてのグループlast_link_id - 最後に追加されたリンクの IDlast_node_id - 最後に追加されたノードの IDlinks - グラフ内のすべてのリンクのリスト。各エントリは 5 つの整数と 1 つの文字列の配列です：
- (
link_id, upstream_node_id, upstream_node_output_slot, downstream_node_id, downstream_node_input_slot, data type)
nodes - グラフ内のすべてのノードのリスト。各エントリは、上記 で説明したノードのプロパティのサブセットのマップです
- 以下のプロパティが含まれます：
flags、id、inputs、mode、order、pos、properties、size、type、widgets_values
- さらに、ノードに出力がない場合を除き、
outputs プロパティがあります。これはノードの出力のリストであり、それぞれ以下を含みます：
name - 出力の名前type - 出力のデータ型links - この出力からのすべてのリンクの link_id のリスト（接続がない場合、空のリストまたは null の可能性があります）shape - 出力を描画するために使用される形状（デフォルトはドットで 3）slot_index - 出力のスロット番号
version - LiteGraph のバージョン番号（執筆時点では 0.4）
nodes.output は出力のないノードには存在せず、空のリストではありません。
