mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
SnapOtterandGitHub
f858c4cea0
Renames 18 ambiguous or hard-to-search tool names so image tools self-qualify like the other modalities ("Compress" becomes "Compress Image"), and cleans up a few awkward names. Propagated across search (constants.ts), display (en.ts + 20 locales), the OpenAPI base spec + 20 locale specs, and the docs tool-page headings in 21 languages. Removes the duplicate "Normalize Audio" summary shared by the video and audio endpoints. Tool ids and routes are unchanged, so no API paths or bookmarks break.
93 lines
6.9 KiB
Markdown
93 lines
6.9 KiB
Markdown
---
|
|
description: "รวมภาพหลายภาพเข้าเป็นคอลลาจแบบกริดด้วยเทมเพลตกว่า 25 แบบ ปรับช่องว่างและมุมได้ พร้อมแพนและซูมแยกตามแต่ละช่อง"
|
|
i18n_source_hash: cd50a782239d
|
|
i18n_provenance: human
|
|
i18n_output_hash: 1e8ce01e652b
|
|
---
|
|
|
|
# คอลลาจและกริด {#collage-grid}
|
|
|
|
รวมภาพหลายภาพเข้าเป็นคอลลาจแบบกริดที่สวยงามด้วยเทมเพลตกว่า 25 แบบ รองรับเลย์เอาต์ตั้งแต่ 2 ถึง 9 ภาพ พร้อมปรับแต่งช่องว่าง รัศมีมุม สีพื้นหลัง และตัวควบคุมแพน/ซูมแยกตามแต่ละช่อง
|
|
|
|
## API Endpoint {#api-endpoint}
|
|
|
|
`POST /api/v1/tools/image/collage`
|
|
|
|
## Parameters {#parameters}
|
|
|
|
| Parameter | Type | Required | Default | Description |
|
|
|-----------|------|----------|---------|-------------|
|
|
| templateId | string | Yes | - | ID เลย์เอาต์เทมเพลต (เช่น `2-h-equal`, `3-left-large`, `4-grid`, `9-grid`) |
|
|
| cells | array | No | - | อาร์เรย์การตั้งค่าแยกตามแต่ละช่อง พร้อม `imageIndex`, `panX`, `panY`, `zoom`, `objectFit` |
|
|
| cells[].imageIndex | integer | Yes | - | ดัชนีของภาพที่จะวางในช่องนี้ (เริ่มจาก 0) |
|
|
| cells[].panX | number | No | 0 | ระยะออฟเซ็ตแพนแนวนอน (-100 ถึง 100) |
|
|
| cells[].panY | number | No | 0 | ระยะออฟเซ็ตแพนแนวตั้ง (-100 ถึง 100) |
|
|
| cells[].zoom | number | No | 1 | ระดับการซูม (1 ถึง 10) |
|
|
| cells[].objectFit | string | No | `"cover"` | วิธีที่ภาพเติมเต็มช่อง: `cover` หรือ `contain` |
|
|
| gap | number | No | 8 | ช่องว่างระหว่างช่องเป็นพิกเซล (0 ถึง 500) |
|
|
| cornerRadius | number | No | 0 | รัศมีมุมของแต่ละช่องเป็นพิกเซล (0 ถึง 500) |
|
|
| backgroundColor | string | No | `"#FFFFFF"` | สีพื้นหลังเป็นค่า hex หรือ `"transparent"` |
|
|
| aspectRatio | string | No | `"free"` | สัดส่วนภาพของแคนวาส: `free`, `1:1`, `4:3`, `3:2`, `16:9`, `9:16`, `4:5` |
|
|
| outputFormat | string | No | `"png"` | รูปแบบเอาต์พุต: `png`, `jpeg`, `webp`, `avif`, `jxl` |
|
|
| quality | number | No | 90 | คุณภาพเอาต์พุต (1 ถึง 100) |
|
|
|
|
## Available Templates {#available-templates}
|
|
|
|
| Template ID | Images | Layout |
|
|
|-------------|--------|--------|
|
|
| `2-h-equal` | 2 | สองคอลัมน์เท่ากัน |
|
|
| `2-v-equal` | 2 | สองแถวเท่ากัน |
|
|
| `2-h-left-large` | 2 | ซ้าย 2/3, ขวา 1/3 |
|
|
| `2-h-right-large` | 2 | ซ้าย 1/3, ขวา 2/3 |
|
|
| `3-left-large` | 3 | ใหญ่ทางซ้าย สองภาพซ้อนกันทางขวา |
|
|
| `3-right-large` | 3 | สองภาพซ้อนกันทางซ้าย ใหญ่ทางขวา |
|
|
| `3-top-large` | 3 | ใหญ่ด้านบน สองคอลัมน์ด้านล่าง |
|
|
| `3-h-equal` | 3 | สามคอลัมน์เท่ากัน |
|
|
| `3-v-equal` | 3 | สามแถวเท่ากัน |
|
|
| `4-grid` | 4 | กริด 2x2 |
|
|
| `4-left-large` | 4 | ใหญ่ทางซ้าย สามภาพซ้อนกันทางขวา |
|
|
| `4-top-large` | 4 | ใหญ่ด้านบน สามคอลัมน์ด้านล่าง |
|
|
| `4-bottom-large` | 4 | สามคอลัมน์ด้านบน ใหญ่ด้านล่าง |
|
|
| `5-top2-bottom3` | 5 | สองภาพด้านบน สามภาพด้านล่าง |
|
|
| `5-top3-bottom2` | 5 | สามภาพด้านบน สองภาพด้านล่าง |
|
|
| `5-left-large` | 5 | ใหญ่ทางซ้าย สี่ภาพซ้อนกันทางขวา |
|
|
| `5-center-large` | 5 | ใหญ่ตรงกลาง สี่มุม |
|
|
| `6-grid-2x3` | 6 | 2 คอลัมน์ x 3 แถว |
|
|
| `6-grid-3x2` | 6 | 3 คอลัมน์ x 2 แถว |
|
|
| `6-top-large` | 6 | ใหญ่ด้านบน ห้าคอลัมน์ด้านล่าง |
|
|
| `7-mosaic` | 7 | เลย์เอาต์แบบโมเสก |
|
|
| `8-mosaic` | 8 | เลย์เอาต์แบบโมเสก |
|
|
| `9-grid` | 9 | กริด 3x3 |
|
|
|
|
## Example Request {#example-request}
|
|
|
|
```bash
|
|
curl -X POST http://localhost:1349/api/v1/tools/image/collage \
|
|
-F "file=@photo1.jpg" \
|
|
-F "file=@photo2.jpg" \
|
|
-F "file=@photo3.jpg" \
|
|
-F "file=@photo4.jpg" \
|
|
-F 'settings={"templateId":"4-grid","gap":12,"cornerRadius":8,"backgroundColor":"#F5F5F5","outputFormat":"png","quality":90}'
|
|
```
|
|
|
|
## Example Response {#example-response}
|
|
|
|
```json
|
|
{
|
|
"jobId": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
|
|
"downloadUrl": "/api/v1/download/a1b2c3d4-e5f6-7890-abcd-ef1234567890/collage.png",
|
|
"originalSize": 2456789,
|
|
"processedSize": 1823456
|
|
}
|
|
```
|
|
|
|
## Notes {#notes}
|
|
|
|
- อัปโหลดไฟล์ภาพหลายไฟล์ในคำขอ multipart ภาพจะถูกกำหนดให้กับช่องของเทมเพลตตามลำดับการอัปโหลด
|
|
- หากอัปโหลดภาพมากกว่าที่เทมเพลตรองรับ ภาพส่วนเกินจะถูกละเว้น
|
|
- รองรับรูปแบบอินพุต HEIC, RAW, PSD และ SVG (ถอดรหัสอัตโนมัติ)
|
|
- ขนาดฐานของแคนวาสคือ 2400px บนด้านที่ยาวที่สุด แล้วปรับตามสัดส่วนภาพที่เลือก
|
|
- เมื่อ `aspectRatio` เป็น `"free"` แคนวาสจะใช้ค่าเริ่มต้นเป็น 4:3 (2400x1800)
|
|
- ค่า `panX`/`panY` แยกตามแต่ละช่องจะเลื่อนหน้าต่างครอปภายในช่อง ค่า 100 จะเลื่อนไปสุดขอบด้านหนึ่ง และ -100 ไปอีกด้านหนึ่ง
|
|
- สีพื้นหลัง `"transparent"` จะถูกรักษาไว้เฉพาะกับรูปแบบเอาต์พุต `png`, `webp` หรือ `avif` เท่านั้น
|