Skip to content

Commit 343ce25

Browse files
authored
Merge pull request #38 from Comfy-Org/add-image-stitch-docs
Add ImageStitch node documentation in multiple languages
2 parents 22e6972 + 335c016 commit 343ce25

File tree

10 files changed

+363
-0
lines changed

10 files changed

+363
-0
lines changed
15.6 KB
Loading
29.7 KB
Loading
88 KB
Loading
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
This node allows you to stitch two images together in a specified direction (up, down, left, right), with support for size matching and spacing between images.
2+
3+
## Inputs
4+
5+
| Parameter Name | Data Type | Input Type | Default | Range | Description |
6+
|---------------|-----------|-------------|---------|--------|-------------|
7+
| `image1` | IMAGE | Required | - | - | The first image to be stitched |
8+
| `image2` | IMAGE | Optional | None | - | The second image to be stitched, if not provided returns only the first image |
9+
| `direction` | STRING | Required | right | right/down/left/up | The direction to stitch the second image: right, down, left, or up |
10+
| `match_image_size` | BOOLEAN | Required | True | True/False | Whether to resize the second image to match the dimensions of the first image |
11+
| `spacing_width` | INT | Required | 0 | 0-1024 | Width of spacing between images, must be an even number |
12+
| `spacing_color` | STRING | Required | white | white/black/red/green/blue | Color of the spacing between stitched images |
13+
14+
> For `spacing_color`, when using colors other than "white/black", if `match_image_size` is set to `false`, the padding area will be filled with black
15+
16+
## Outputs
17+
18+
| Output Name | Data Type | Description |
19+
|-------------|-----------|-------------|
20+
| `IMAGE` | IMAGE | The stitched image |
21+
22+
## Workflow Example
23+
24+
In the workflow below, we use 3 input images of different sizes as examples:
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**First Image Stitch Node**
33+
34+
- `match_image_size`: false, images will be stitched at their original sizes
35+
- `direction`: up, `image2` will be placed above `image1`
36+
- `spacing_width`: 20
37+
- `spacing_color`: black
38+
39+
Output image 1:
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**Second Image Stitch Node**
44+
45+
- `match_image_size`: true, the second image will be scaled to match the height or width of the first image
46+
- `direction`: right, `image3` will appear on the right side
47+
- `spacing_width`: 20
48+
- `spacing_color`: white
49+
50+
Output image 2:
51+
52+
![output2](./asset/output-2.webp)
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
Este nodo te permite unir dos imágenes en una dirección específica (arriba, abajo, izquierda, derecha), con soporte para ajustar el tamaño y añadir espaciado entre las imágenes.
2+
3+
## Entradas
4+
5+
| Nombre del Parámetro | Tipo de Dato | Tipo de Entrada | Valor Predeterminado | Rango | Descripción |
6+
|---------------------|--------------|-----------------|---------------------|--------|-------------|
7+
| `image1` | IMAGE | Requerido | - | - | La primera imagen a unir |
8+
| `image2` | IMAGE | Opcional | None | - | La segunda imagen a unir, si no se proporciona solo devuelve la primera imagen |
9+
| `direction` | STRING | Requerido | right | right/down/left/up | La dirección para unir la segunda imagen: right (derecha), down (abajo), left (izquierda), o up (arriba) |
10+
| `match_image_size` | BOOLEAN | Requerido | True | True/False | Si se debe redimensionar la segunda imagen para que coincida con las dimensiones de la primera imagen |
11+
| `spacing_width` | INT | Requerido | 0 | 0-1024 | Ancho del espaciado entre imágenes, debe ser un número par |
12+
| `spacing_color` | STRING | Requerido | white | white/black/red/green/blue | Color del espaciado entre las imágenes unidas |
13+
14+
> Para `spacing_color`, cuando se usan colores diferentes a "white/black", si `match_image_size` está configurado como `false`, el área de relleno será de color negro
15+
16+
## Salidas
17+
18+
| Nombre de Salida | Tipo de Dato | Descripción |
19+
|------------------|--------------|-------------|
20+
| `IMAGE` | IMAGE | La imagen unida |
21+
22+
## Ejemplo de Flujo de Trabajo
23+
24+
En el flujo de trabajo a continuación, usamos 3 imágenes de entrada de diferentes tamaños como ejemplos:
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**Primer Nodo Image Stitch**
33+
34+
- `match_image_size`: false, las imágenes se unirán en sus tamaños originales
35+
- `direction`: up, `image2` se colocará encima de `image1`
36+
- `spacing_width`: 20
37+
- `spacing_color`: black
38+
39+
Imagen de salida 1:
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**Segundo Nodo Image Stitch**
44+
45+
- `match_image_size`: true, la segunda imagen se escalará para coincidir con la altura o el ancho de la primera imagen
46+
- `direction`: right, `image3` aparecerá en el lado derecho
47+
- `spacing_width`: 20
48+
- `spacing_color`: white
49+
50+
Imagen de salida 2:
51+
52+
![output2](./asset/output-2.webp)
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
Ce nœud vous permet d'assembler deux images dans une direction spécifiée (haut, bas, gauche, droite), avec la possibilité d'ajuster la taille et d'ajouter un espacement entre les images.
2+
3+
## Entrées
4+
5+
| Nom du Paramètre | Type de Données | Type d'Entrée | Valeur par Défaut | Plage | Description |
6+
|-----------------|-----------------|----------------|-------------------|--------|-------------|
7+
| `image1` | IMAGE | Requis | - | - | La première image à assembler |
8+
| `image2` | IMAGE | Optionnel | None | - | La deuxième image à assembler, si non fournie, renvoie uniquement la première image |
9+
| `direction` | STRING | Requis | right | right/down/left/up | La direction pour assembler la deuxième image : right (droite), down (bas), left (gauche), ou up (haut) |
10+
| `match_image_size` | BOOLEAN | Requis | True | True/False | Si la deuxième image doit être redimensionnée pour correspondre aux dimensions de la première image |
11+
| `spacing_width` | INT | Requis | 0 | 0-1024 | Largeur de l'espacement entre les images, doit être un nombre pair |
12+
| `spacing_color` | STRING | Requis | white | white/black/red/green/blue | Couleur de l'espacement entre les images assemblées |
13+
14+
> Pour `spacing_color`, lors de l'utilisation de couleurs autres que "white/black", si `match_image_size` est défini sur `false`, la zone de remplissage sera noire
15+
16+
## Sorties
17+
18+
| Nom de Sortie | Type de Données | Description |
19+
|---------------|-----------------|-------------|
20+
| `IMAGE` | IMAGE | L'image assemblée |
21+
22+
## Exemple de Flux de Travail
23+
24+
Dans le flux de travail ci-dessous, nous utilisons 3 images d'entrée de différentes tailles comme exemples :
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**Premier Nœud Image Stitch**
33+
34+
- `match_image_size`: false, les images seront assemblées dans leurs tailles d'origine
35+
- `direction`: up, `image2` sera placée au-dessus de `image1`
36+
- `spacing_width`: 20
37+
- `spacing_color`: black
38+
39+
Image de sortie 1 :
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**Deuxième Nœud Image Stitch**
44+
45+
- `match_image_size`: true, la deuxième image sera mise à l'échelle pour correspondre à la hauteur ou la largeur de la première image
46+
- `direction`: right, `image3` apparaîtra sur le côté droit
47+
- `spacing_width`: 20
48+
- `spacing_color`: white
49+
50+
Image de sortie 2 :
51+
52+
![output2](./asset/output-2.webp)
Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
このノードは、2つの画像を指定した方向(上、下、左、右)に結合することができ、サイズの調整や画像間の間隔設定をサポートしています。
2+
3+
## 入力
4+
5+
| パラメータ名 | データ型 | 入力タイプ | デフォルト値 | 範囲 | 説明 |
6+
|------------|----------|------------|-------------|------|------|
7+
| `image1` | IMAGE | 必須 | - | - | 結合する1枚目の画像 |
8+
| `image2` | IMAGE | 任意 | None | - | 結合する2枚目の画像(指定しない場合は1枚目の画像のみを返す) |
9+
| `direction` | STRING | 必須 | right | right/down/left/up | 2枚目の画像を結合する方向:right(右)、down(下)、left(左)、up(上) |
10+
| `match_image_size` | BOOLEAN | 必須 | True | True/False | 2枚目の画像のサイズを1枚目の画像のサイズに合わせるかどうか |
11+
| `spacing_width` | INT | 必須 | 0 | 0-1024 | 画像間の間隔の幅(偶数である必要があります) |
12+
| `spacing_color` | STRING | 必須 | white | white/black/red/green/blue | 結合された画像間の間隔の色 |
13+
14+
> `spacing_color`について、"white/black"以外の色を使用する場合、`match_image_size``false`に設定されていると、パディング領域は黒で塗りつぶされます
15+
16+
## 出力
17+
18+
| 出力名 | データ型 | 説明 |
19+
|--------|----------|------|
20+
| `IMAGE` | IMAGE | 結合された画像 |
21+
22+
## ワークフロー例
23+
24+
以下のワークフローでは、異なるサイズの3つの入力画像を例として使用しています:
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**1つ目のImage Stitchノード**
33+
34+
- `match_image_size`: false、画像は元のサイズのまま結合されます
35+
- `direction`: up、`image2``image1`の上に配置されます
36+
- `spacing_width`: 20
37+
- `spacing_color`: black
38+
39+
出力画像1:
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**2つ目のImage Stitchノード**
44+
45+
- `match_image_size`: true、2枚目の画像は1枚目の画像の高さまたは幅に合わせてサイズ調整されます
46+
- `direction`: right、`image3`は右側に表示されます
47+
- `spacing_width`: 20
48+
- `spacing_color`: white
49+
50+
出力画像2:
51+
![output2](./asset/output-2.webp)
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
이 노드는 두 이미지를 지정된 방향(위, 아래, 왼쪽, 오른쪽)으로 결합할 수 있으며, 크기 조정과 이미지 간 간격 설정을 지원합니다.
2+
3+
## 입력
4+
5+
| 매개변수 이름 | 데이터 타입 | 입력 타입 | 기본값 | 범위 | 설명 |
6+
|--------------|------------|------------|--------|-------|------|
7+
| `image1` | IMAGE | 필수 | - | - | 결합할 첫 번째 이미지 |
8+
| `image2` | IMAGE | 선택 | None | - | 결합할 두 번째 이미지, 제공되지 않으면 첫 번째 이미지만 반환 |
9+
| `direction` | STRING | 필수 | right | right/down/left/up | 두 번째 이미지를 결합할 방향: right (오른쪽), down (아래), left (왼쪽), up (위) |
10+
| `match_image_size` | BOOLEAN | 필수 | True | True/False | 두 번째 이미지의 크기를 첫 번째 이미지의 크기에 맞출지 여부 |
11+
| `spacing_width` | INT | 필수 | 0 | 0-1024 | 이미지 사이의 간격 너비, 짝수여야 함 |
12+
| `spacing_color` | STRING | 필수 | white | white/black/red/green/blue | 결합된 이미지 사이의 간격 색상 |
13+
14+
> `spacing_color`의 경우, "white/black" 이외의 색상을 사용할 때 `match_image_size``false`로 설정되어 있으면 패딩 영역이 검은색으로 채워집니다
15+
16+
## 출력
17+
18+
| 출력 이름 | 데이터 타입 | 설명 |
19+
|-----------|------------|------|
20+
| `IMAGE` | IMAGE | 결합된 이미지 |
21+
22+
## 워크플로우 예시
23+
24+
아래 워크플로우에서는 서로 다른 크기의 3개 입력 이미지를 예시로 사용합니다:
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**첫 번째 Image Stitch 노드**
33+
34+
- `match_image_size`: false, 이미지들이 원본 크기로 결합됨
35+
- `direction`: up, `image2``image1` 위에 배치됨
36+
- `spacing_width`: 20
37+
- `spacing_color`: black
38+
39+
출력 이미지 1:
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**두 번째 Image Stitch 노드**
44+
45+
- `match_image_size`: true, 두 번째 이미지가 첫 번째 이미지의 높이나 너비에 맞게 크기 조정됨
46+
- `direction`: right, `image3`가 오른쪽에 나타남
47+
- `spacing_width`: 20
48+
- `spacing_color`: white
49+
50+
출력 이미지 2:
51+
52+
![output2](./asset/output-2.webp)
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
Этот узел позволяет объединить два изображения в указанном направлении (вверх, вниз, влево, вправо), с поддержкой подгонки размера и настройки интервала между изображениями.
2+
3+
## Входы
4+
5+
| Имя Параметра | Тип Данных | Тип Ввода | Значение по Умолчанию | Диапазон | Описание |
6+
|---------------|------------|------------|----------------------|-----------|-----------|
7+
| `image1` | IMAGE | Обязательный | - | - | Первое изображение для объединения |
8+
| `image2` | IMAGE | Необязательный | None | - | Второе изображение для объединения, если не указано, возвращается только первое изображение |
9+
| `direction` | STRING | Обязательный | right | right/down/left/up | Направление для объединения второго изображения: right (вправо), down (вниз), left (влево), up (вверх) |
10+
| `match_image_size` | BOOLEAN | Обязательный | True | True/False | Нужно ли изменить размер второго изображения, чтобы оно соответствовало размерам первого |
11+
| `spacing_width` | INT | Обязательный | 0 | 0-1024 | Ширина интервала между изображениями, должна быть четным числом |
12+
| `spacing_color` | STRING | Обязательный | white | white/black/red/green/blue | Цвет интервала между объединенными изображениями |
13+
14+
> Для параметра `spacing_color` при использовании цветов, отличных от "white/black", если `match_image_size` установлен как `false`, область заполнения будет черной
15+
16+
## Выходы
17+
18+
| Имя Выхода | Тип Данных | Описание |
19+
|------------|------------|-----------|
20+
| `IMAGE` | IMAGE | Объединенное изображение |
21+
22+
## Пример Рабочего Процесса
23+
24+
В приведенном ниже рабочем процессе мы используем 3 входных изображения разных размеров в качестве примеров:
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**Первый Узел Image Stitch**
33+
34+
- `match_image_size`: false, изображения будут объединены в их исходных размерах
35+
- `direction`: up, `image2` будет размещено над `image1`
36+
- `spacing_width`: 20
37+
- `spacing_color`: black
38+
39+
Выходное изображение 1:
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**Второй Узел Image Stitch**
44+
45+
- `match_image_size`: true, второе изображение будет масштабировано, чтобы соответствовать высоте или ширине первого изображения
46+
- `direction`: right, `image3` появится справа
47+
- `spacing_width`: 20
48+
- `spacing_color`: white
49+
50+
Выходное изображение 2:
51+
52+
![output2](./asset/output-2.webp)
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
这个节点可以将两张图片按指定方向(上、下、左、右)拼接在一起,支持调整图片大小匹配和添加间隔。
2+
3+
## 输入
4+
5+
| 参数名称 | 数据类型 | 输入方式 | 默认值 | 取值范围 | 功能说明 |
6+
|----------|----------|----------|---------|----------|----------|
7+
| `image1` | IMAGE | 必填 | - | - | 第一张要拼接的图片 |
8+
| `image2` | IMAGE | 选填 | None | - | 第二张要拼接的图片,如果不提供则只返回第一张图片 |
9+
| `direction` | STRING | 必填 | right | right/down/left/up | 第二张图片的拼接方向:right(右)、down(下)、left(左)、up(上) |
10+
| `match_image_size` | BOOLEAN | 必填 | True | True/False | 是否调整第二张图片的大小以匹配第一张图片的尺寸 |
11+
| `spacing_width` | INT | 必填 | 0 | 0-1024 | 两张图片之间的间隔宽度,必须是偶数 |
12+
| `spacing_color` | STRING | 必填 | white | white/black/red/green/blue | 拼接图片之间间隔的颜色 |
13+
14+
> 对于 `spacing_color` 除了 "white/black" 之外,如果 `match_image_size` 设置为 `false` 那么空白部分将使用黑色作为填充色
15+
16+
## 输出
17+
18+
| 输出名称 | 数据类型 | 说明 |
19+
|----------|----------|------|
20+
| `IMAGE` | IMAGE | 拼接后的图片 |
21+
22+
## 工作流示例
23+
24+
在下面的工作流中,我们使用了3 张不同尺寸的输入图片作为示例
25+
26+
- image1: 500x300
27+
- image2: 400x250
28+
- image3: 300x300
29+
30+
![workflow](./asset/workflow.webp)
31+
32+
**第一个 Image Stitch 节点**
33+
34+
- `match_image_size`: false, 两张图像将会已原有尺寸拼接
35+
- `direction`: up, `image2` 将会在 `image1` 上方
36+
- `spacing_width`: 20
37+
- `spacing_color` : black
38+
39+
输出图片1:
40+
41+
![output1](./asset/output-1.webp)
42+
43+
**第二个 Image Stitch 节点**
44+
45+
- `match_image_size`: true, 第二张图像将会缩放到与第一张图像相同的高度或者宽度
46+
- `direction`:right, `image3` 将会出现在右侧
47+
- `spacing_width`: 20
48+
- `spacing_color` : white
49+
50+
输出图片2:
51+
52+
![output2](./asset/output-2.webp)

0 commit comments

Comments
 (0)