Bỏ qua

Params

Params giữ cấu hình hiển thị ngay cạnh diagram mà không trộn với cú pháp của renderer.

```plantuml {theme=corporate scale=1.5 direction=lr} title="Review flow"
@startuml
Alice -> Bob: Request review
Bob --> Alice: Approved
@enduml
```

plantuml chọn renderer, {...} chứa render options và title là metadata để nhận diện diagram.

1. Cú pháp fence

```language {render options} title="Diagram name"
diagram source
```
  • Đặt params trong đúng một cặp {...} sau language.
  • Phân cách option bằng whitespace, dấu phẩy hoặc dấu chấm phẩy.
  • Đặt value có khoảng trắng trong dấu ".
  • title nằm ngoài {...}.
  • Có thể dùng shorthand x2 hoặc x1.5 cho scale.
  • Camel case và _ được chuẩn hóa thành kebab-case.
  • Fence params không vượt 1.024 byte.

2. Source directive

File diagram độc lập hoặc integration không đọc fence dùng %%krokup trong tối đa 20 dòng đầu:

%%krokup {theme=dark scale=2}
@startuml
Alice -> Bob: Review
@enduml

Directive dài tối đa 2.048 ký tự và source chỉ nên có một directive. Các dạng %%krokup x2, %%krokup theme=dark, scale=2 và dạng có {...} đều hợp lệ.

3. Hỗ trợ theo công cụ

Công cụ Fence params Source directive
VS Code Live Preview Fallback khi fence không có params
VS Code Markdown Preview Fallback khi fence không có params
Playground Fenced block Playground tự tổng hợp trước request
GitLab document với custom image Fallback khi fence không có params
GitLab MR browser extension Chưa
Confluence

4. Thứ tự ưu tiên

Fence params thay source directive trong phần đầu body. Sau khi request tới server, option được kết hợp từ thấp đến cao:

server defaults
  < selected theme
  < preferred policy
  < request option
  < source option
  < enforced policy

5. Option chung

Nhóm Option
Layout direction, layout, rank-separation, node-separation, edge-routing, orientation
Typography font-family, font-size, font-weight
Color primary-color, secondary-color, accent-color, background, text-color, line-color, border-color
Box model border-width, border-radius, padding, spacing
Size scale, width, height, max-width, max-height
Output transparent, format, quality, density
Theme theme

Các giới hạn chính: scale từ 0,25 đến 8; kích thước từ 1 đến 32.768; padding/spacing từ 0 đến 1.000; quality từ 0 đến 1. Renderer catalog tại GET /api/diagram-types cho biết option và format thực tế của từng engine.

6. Khác biệt theo renderer và format

  • PlantUML/C4-PlantUML preprocess direction, theme, font và color.
  • Mermaid preprocess direction, theme, font và palette.
  • Graphviz hỗ trợ layout cùng rank/node separation và edge routing.
  • D2 preprocess direction.
  • Option chung có thể được post-process trên output của renderer còn lại.
  • SVG hỗ trợ size, padding, background, recolor và font khi an toàn.
  • PNG/JPEG hỗ trợ resize, padding, background và quality; transparency chỉ có ý nghĩa với PNG.
  • PDF hỗ trợ scale và padding mà không rasterize.
  • Text/base64 giữ output và cảnh báo với option không áp dụng được.

7. Warning

Playground hiển thị warning dưới preview; API client đọc X-Diagram-Warnings. KROKI_UNIVERSAL_UNSUPPORTED_MODE quyết định hành vi:

Giá trị Hành vi
ignore Bỏ option unsupported
warn Bỏ option và trả warning
error Dừng request bằng lỗi

Warning không đồng nghĩa render thất bại; output vẫn có thể hợp lệ sau khi option không hỗ trợ bị bỏ qua.