Edit in Dokuwiki Edit in Asciidoc Edit in Markdown
Display YAML Data

YAML format is widely used in software.
You can use PlantUML to visualize your data.
To activate this feature, the diagram must:

begin with @startyaml keyword

end with @endyaml keyword.

🎉 Copied!

@startyaml fruit: Apple size: Large color: - Red - Green @endyaml

Edit in Dokuwiki Edit in Asciidoc Edit in Markdown
Complex example

🎉 Copied!

@startyaml doe: "a deer, a female deer" ray: "a drop of golden sun" pi: 3.14159 xmas: true french-hens: 3 calling-birds: - huey - dewey - louie - fred xmas-fifth-day: calling-birds: four french-hens: 3 golden-rings: 5 partridges: count: 1 location: "a pear tree" turtle-doves: two @endyaml

Edit in Dokuwiki Edit in Asciidoc Edit in Markdown
Specific key (with symbols or unicode)

🎉 Copied!

@startyaml @fruit: Apple $size: Large &color: Red ❤: Heart ‰: Per mille @endyaml

[Ref. QA-13376]

Edit in Dokuwiki Edit in Asciidoc Edit in Markdown
Highlight parts

Normal style

🎉 Copied!

@startyaml #highlight "french-hens" #highlight "xmas-fifth-day" / "partridges" doe: "a deer, a female deer" ray: "a drop of golden sun" pi: 3.14159 xmas: true french-hens: 3 calling-birds: - huey - dewey - louie - fred xmas-fifth-day: calling-birds: four french-hens: 3 golden-rings: 5 partridges: count: 1 location: "a pear tree" turtle-doves: two @endyaml

Customised style

🎉 Copied!

@startyaml <style> yamlDiagram { highlight { BackGroundColor red FontColor white FontStyle italic } } </style> #highlight "french-hens" #highlight "xmas-fifth-day" / "partridges" doe: "a deer, a female deer" ray: "a drop of golden sun" pi: 3.14159 xmas: true french-hens: 3 calling-birds: - huey - dewey - louie - fred xmas-fifth-day: calling-birds: four french-hens: 3 golden-rings: 5 partridges: count: 1 location: "a pear tree" turtle-doves: two @endyaml

[Ref. QA-13288]

Edit in Dokuwiki Edit in Asciidoc Edit in Markdown
Using (global) style

Without style (by default)

🎉 Copied!

@startyaml - name: Mark McGwire hr: 65 avg: 0.278 - name: Sammy Sosa hr: 63 avg: 0.288 @endyaml

With style

You can use style to change rendering of elements.

🎉 Copied!

@startyaml <style> yamlDiagram { node { BackGroundColor lightblue LineColor lightblue FontName Helvetica FontColor red FontSize 18 FontStyle bold BackGroundColor Khaki RoundCorner 0 LineThickness 2 LineStyle 10-5 separator { LineThickness 0.5 LineColor black LineStyle 1-5 } } arrow { BackGroundColor lightblue LineColor green LineThickness 2 LineStyle 2-5 } } </style> - name: Mark McGwire hr: 65 avg: 0.278 - name: Sammy Sosa hr: 63 avg: 0.288 @endyaml

[Ref. QA-13123]

Complex example
Specific key (with symbols or unicode)
Highlight parts
Using (global) style