PlantUML WordPress Samples

Sequence Diagram

$PlantUML Syntax: @startuml title Future-Watch Possibilities Sequence Diagram participant “3-5 Years” as T1 participant “5-10 Years” as T2 participant “50-100 Years” as T3 participant “100-500 Years” as T4 T1 -> T2: Evolve to contextually accurate journalism\nvia improved training data & feedback\n(Ethical guidelines emerging) T2 -> T3: Blur lines between human & AI reporting\n(hyper-realistic techniques & full AI transitions) T3 -> T4: Transform into interactive news curators\n(specialized fields: human investigative vs. AI-optimized) T4 -> T4: Independently investigate & report\n(establishing new ethics & accountability frameworks) ” usemap=”#plantuml_map”> <h3 class=$ Sequence Diagram

Gantt Diagram

PlantUML Syntax:
@startgantt 
[foo] requires 21 days 
[foo] is 40% completed 
[bar] requires 30 days and is 10% complete 
@endgantt
” usemap=”#plantuml_map”>

 

<hr class=

Component Diagram

$PlantUML Syntax: @startuml package “Some Group” { HTTP – [First Component] [Another Component] } node “Other Groups” { FTP – [Second Component] [First Component] –> FTP } cloud { [Example 1] } database “MySql” { folder “This is my folder” { [Folder 3] } frame “Foo” { [Frame 4] } } [Another Component] –> [Example 1] [Example 1] –> [Folder 3] [Folder 3] –> [Frame 4] @enduml ” usemap=”#plantuml_map”> <hr class=$

State Diagram

$PlantUML Syntax: @startuml scale 350 width [*] –> NotShooting state NotShooting { [*] –> Idle Idle –> Configuring : EvConfig Configuring –> Idle : EvConfig } state Configuring { [*] –> NewValueSelection NewValueSelection –> NewValuePreview : EvNewValue NewValuePreview –> NewValueSelection : EvNewValueRejected NewValuePreview –> NewValueSelection : EvNewValueSaved state NewValuePreview { State1 -> State2 } } @enduml ” usemap=”#plantuml_map”> <hr class=$

Activity Diagram

Use Case Diagram

$PlantUML Syntax: @startuml :Main Admin: as Admin (Use the application) as (Use) User -> (Start) User –> (Use) Admin —> (Use) note right of Admin : This is an example. note right of (Use) A note can also be on several lines end note note “This note is connected\nto several objects.” as N2 (Start) .. N2 N2 .. (Use) @enduml ” usemap=”#plantuml_map”> <hr class=$

PERT Diagram

$PlantUML Syntax: @startuml PERT left to right direction ‘ Horizontal lines: –>, <--, <--> ‘ Vertical lines: ->, <-, <-> title PERT: Project Name map Kick.Off { } map task.1 { Start => End } map task.2 { Start => End } map task.3 { Start => End } map task.4 { Start => End } map task.5 { Start => End } Kick.Off –> task.1 : Label 1 Kick.Off –> task.2 : Label 2 Kick.Off –> task.3 : Label 3 task.1 –> task.4 task.2 –> task.4 task.3 –> task.4 task.4 –> task.5 : Label 4 @enduml ” usemap=”#plantuml_map”> <hr class=$

Json Diagram

$PlantUML Syntax: @startjson { “firstName”: “John”, “lastName”: “Smith”, “isAlive”: true, “age”: 27, “address”: { “streetAddress”: “21 2nd Street”, “city”: “New York”, “state”: “NY”, “postalCode”: “10021-3100” }, “phoneNumbers”: [ { “type”: “home”, “number”: “212 555-1234” }, { “type”: “office”, “number”: “646 555-4567” } ], “children”: [], “spouse”: null } @endjson ” usemap=”#plantuml_map”> <hr class=$

SALT Diagram

$PlantUML Syntax: @startsalt {{^==Creole This is **bold** This is //italics// This is “”monospaced”” This is –stricken-out– This is __underlined__ This is ~~wave-underlined~~ –test Unicode and icons– This is <U+221E> long This is a <&code> icon Use image : <img:https://plantuml.com/logo3.png> }| {^HTML Creole This is bold This is italics This is <font:monospaced>monospaced This is <s>stroked</s> This is underlined This is <w>waved</w> This is <s:green>stroked</s> This is <u:red>underlined This is <w:#0000FF>waved</w> — other examples — This is <color:blue>Blue</color> This is <back:orange>Orange background</back> This is <size:20>big</size> }| {^Creole line You can have horizontal line —- Or double line ==== Or strong line ____ Or dotted line ..My title.. Or dotted title //and title… // ==Title== Or double-line title –Another title– Or single-line title Enjoy! }| {^Creole list item **test list 1** * Bullet list * Second item ** Sub item *** Sub sub item * Third item —- **test list 2** # Numbered list # Second item ## Sub item ## Another sub item # Third item }| {^Mix on salt ==<color:Blue>Just plain text [This is my default button] [<color:green>This is my green button] [ —<color:#9a9a9a>This is my disabled button– ] [] <size:20><color:red>Unchecked box [X] <color:green>Checked box “//Enter text here// “ ^This is a droplist^ ^<color:#9a9a9a>This is a disabled droplist^ ^<color:red>This is a red droplist^ }} @endsalt ” usemap=”#plantuml_map”> <hr class=$

Regex Diagram

$PlantUML Syntax: @startregex title repetitionEquivalance a{0,1}b{1,} is the same as a?b+ @endregex @enduml ” usemap=”#plantuml_map”> <hr class=$

BNF Diagram

“;
TypeArgumentList = TypeArgument {“,”, TypeArgument};
TypeArgument = ReferenceType | Wildcard;
Wildcard = {Annotation}, “?”, [WildcardBounds];
WildcardBounds = (“extends” | “super”), ReferenceType;
@endebnf

” usemap=”#plantuml_map”>

Archimate Diagram

$PlantUML Syntax: @startuml skinparam rectangle<<behavior>> { roundCorner 25 } sprite $bProcess jar:archimate/business-process sprite $aService jar:archimate/application-service sprite $aComponent jar:archimate/application-component rectangle “Handle claim” as HC <<$bProcess>><<behavior>> #Business rectangle “Capture Information” as CI <<$bProcess>><<behavior>> #Business rectangle “Notify\nAdditional Stakeholders” as NAS <<$bProcess>><<behavior>> #Business rectangle “Validate” as V <<$bProcess>><<behavior>> #Business rectangle “Investigate” as I <<$bProcess>><<behavior>> #Business rectangle “Pay” as P <<$bProcess>><<behavior>> #Business HC *-down- CI HC *-down- NAS HC *-down- V HC *-down- I HC *-down- P CI -right->> NAS NAS -right->> V V -right->> I I -right->> P rectangle “Scanning” as scanning <<$aService>><<behavior>> #Application rectangle “Customer admnistration” as customerAdministration <<$aService>><<behavior>> #Application rectangle “Claims admnistration” as claimsAdministration <<$aService>><<behavior>> #Application rectangle Printing <<$aService>><<behavior>> #Application rectangle Payment <<$aService>><<behavior>> #Application scanning -up-> CI customerAdministration -up-> CI claimsAdministration -up-> NAS claimsAdministration -up-> V claimsAdministration -up-> I Payment -up-> P Printing -up-> V Printing -up-> P rectangle “Document\nManagement\nSystem” as DMS <<$aComponent>> #Application rectangle “General\nCRM\nSystem” as CRM <<$aComponent>> #Application rectangle “Home & Away\nPolicy\nAdministration” as HAPA <<$aComponent>> #Application rectangle “Home & Away\nFinancial\nAdministration” as HFPA <<$aComponent>> #Application DMS .up.|> scanning DMS .up.|> Printing CRM .up.|> customerAdministration HAPA .up.|> claimsAdministration HFPA .up.|> Payment legend left Example from the “Archisurance case study” (OpenGroup). See ==== <$bProcess> :business process ==== <$aService> : application service ==== <$aComponent> : application component endlegend @enduml ” usemap=”#plantuml_map”> <hr class=$

Mindmap

Information Engineering Diagram

$PlantUML Syntax: @startuml ‘ hide the spot ‘ hide circle ‘ avoid problems with angled crows feet skinparam linetype ortho entity “User” as e01 { *user_id : number <<generated>> — *name : text description : text } entity “Card” as e02 { *card_id : number <<generated>> sync_enabled: boolean version: number last_sync_version: number — *user_id : number <<FK>> other_details : text } entity “CardHistory” as e05 { *card_history_id : number <<generated>> version : number — *card_id : number <<FK>> other_details : text } entity “CardsAccounts” as e04 { *id : number <<generated>> — card_id : number <<FK>> account_id : number <<FK>> other_details : text } entity “Account” as e03 { *account_id : number <<generated>> — user_id : number <<FK>> other_details : text } entity “Stream” as e06 { *id : number <<generated>> version: number searchingText: string — owner_id : number <<FK>> follower_id : number <<FK>> card_id: number <<FK>> other_details : text } e01 }|..|| e02 e01 }|..|| e03 e02 }|..|| e05 e02 }|..|| e04 e03 }|..|| e04 e02 }|..|| e06 e03 }|..|| e06 @enduml ” usemap=”#plantuml_map”> <hr class=$

ER Diagram

$PlantUML Syntax: @startchen movies <style> .red { BackGroundColor Red FontColor White } .blue { BackGroundColor Blue FontColor White } </style> entity “Director” as DIRECTOR { “No.” as Number <<key>> Name { Fname Lname } Born : DATE Died<<red>> Age<<blue>> } entity “Customer” as CUSTOMER { Number <<key>> Bonus <<derived>> Name <<multi>> } entity “Movie” as MOVIE { Code } relationship “was-rented-to” as RENTED_TO { Date } RENTED_TO -1- CUSTOMER RENTED_TO -N- MOVIE RENTED_TO -(N,M)- DIRECTOR entity “Parent” as PARENT { } entity “Member” as MEMBER { } CUSTOMER ->- PARENT MEMBER –<- CUSTOMER entity$ > {
Name <>
}

relationship “is-parent-of” as PARENT_OF <> {
}

PARENT_OF -1- PARENT
PARENT_OF =N= CHILD

entity “Little Kid” as TODDLER {
FavoriteToy
}

entity “Primary-Aged Kid” as PRIMARY_AGE {
FavoriteColor
}

entity “Teenager” as TEEN {
Hobby
}

CHILD =>= d { TODDLER, PRIMARY_AGE, TEEN }

entity “Human” as PERSON {
}

PERSON ->- U { CUSTOMER, DIRECTOR }
@endchen

” usemap=”#plantuml_map”>

Hyperlinks in Diagrams

$PlantUML Syntax: @startuml actor Bob [[http://plantuml.com/sequence]] actor “This is [[http://plantuml.com/sequence Alice]] actor” as Alice Bob -> Alice [[http://plantuml.com/start]] : hello note left [[http://plantuml.com/start]] a note with a link end note Alice -> Bob : hello with [[http://plantuml.com/start{Tooltip for message} some link]] note right [[http://plantuml.com/start]] : another note note left of Bob You can use [[http://plantuml.com/start links in notes]] also. end note @enduml ” usemap=”#plantuml_map”><map id=$

PlantUML WordPress Samples

Sequence Diagram

Gantt Diagram

Component Diagram

State Diagram

Activity Diagram

Use Case Diagram

PERT Diagram

Json Diagram

SALT Diagram

Regex Diagram

BNF Diagram

Archimate Diagram

Mindmap

Information Engineering Diagram

ER Diagram

Hyperlinks in Diagrams

WBS Diagram

Deployment Diagram