תרשים רצף
Mermaid יכולה לרנדר תרשים רצף. תרשים רצף הוא תרשים אינטראקציה, המציג כיצד תהליכים שונים פועלים זה עם זה ואת סדר הפעולות.
העתק
הטמעה
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!
הערה לגבי צמתים: בגלל אופן הכתיבה של שפת Mermaid, המילה "end" תשבור את התרשים כולו. אם חייבים להשתמש ב-"end", יש לעטוף את המילה "end" בסוגריים עגולים (), במרכאות כפולות "", בסוגריים מסולסלים {} או בסוגריים מרובעים [], כלומר: (end), [end], {end}.
תחביר
משתתף
המשתתפים מוצגים לפי סדר הופעתם בטקסט המקור של התרשים. לעיתים, ייתכן שתרצה להציג את המשתתפים בסדר שונה מסדר הופעתם בהודעה הראשונה; ניתן לציין את סדר הופעת המשתתפים באמצעים הבאים:
העתק
הטמעה
sequenceDiagram
participant Alice
participant Bob
Bob->>Alice: Hi Alice
Alice->>Bob: Hi Bob
角色
אם ברצונך להשתמש בסימן תפקיד במקום במלבן עם טקסט, ניתן לעשות זאת באמצעות הצהרת תפקיד, כפי שמוצג להלן.
העתק
הטמעה
sequenceDiagram
actor Alice
actor Bob
Alice->>Bob: Hi Bob
Bob->>Alice: Hi Alice
כינוי
ניתן להגדיר כינוי באמצעות as לאחר הצהרת המשתתף
העתק
הטמעה
sequenceDiagram
participant A as Alice
participant J as John
A->>J: Hello John, how are you?
J->>A: Great!
יצירה והשמדה של משתתפים
ניתן ליצור ולהשמיד משתתפים באמצעות הודעות. לשם כך, הוסף הוראת יצירה או השמדה לפני ההודעה.
העתק
הטמעה
participant B
A --> B: Hello
בהוראת יצירה נתמך ההבחנה בין משתתף לכינוי. השולח או המקבל של ההודעה יכולים להיות מושמדים, אך המקבל יכול רק להיווצר.
העתק
הטמעה
sequenceDiagram
Alice->>Bob: Hello Bob, how are you ?
Bob->>Alice: Fine, thank you. And you?
create participant Carl
Alice->>Carl: Hi Carl!
create actor D as Donald
Carl->>D: Hi!
destroy Carl
Alice-xCarl: We are too many
destroy Bob
Bob->>Alice: I agree
קיבוץ/מסגרת
ניתן לקבץ משתתפים בתיבה אנכית. ניתן להשתמש בסימן כדי להגדיר צבע (אם לא הוגדר, הוא יהיה שקוף).
העתק
הטמעה
box Aqua Group Description
... actors ...
end
box Group without description
... actors ...
end
box rgb(33,66,99)
... actors ...
end
box rgba(33,66,99,0.5)
... actors ...
end
אם שם הקבוצה שלך צבעוני, ניתן לכפות את הצבע הזה לשקיפות:
העתק
הטמעה
box transparent Aqua
... actors ...
end
העתק
הטמעה
sequenceDiagram
box Orange Alice & John
participant A
participant J
end
box Another Group
participant B
participant C
end
A->>J: Hello John, how are you?
J->>A: Great!
A->>B: Hello Bob, how is Charley?
B->>C: Hello Charley, how are you?
הודעה
ההודעה יכולה להיות מוצגת בקו מלא או בקו מקווקו.
הקווים יכולים להיות מלאים או מקווקווים, ותומכים בסיום בסוגים שונים של חצים, הצלבות או חצים פתוחים.
העתק
הטמעה
[Actor][Arrow][Actor]:Message text
עשרה סוגי חצים סטנדרטיים
| סוג | תיאור |
|---|---|
| -> | קו מלא ללא חץ |
| --> | קו מקווקו ללא חץ |
| ->> | קו מלא עם חץ |
| -->> | קו מקווקו עם חץ |
| <<->> | קו מלא עם חץ דו-כיווני |
| <<-->> | קו מקווקו עם חץ דו-כיווני |
| -x | קו מלא עם הצלבה בקצה |
| --x | קו מקווקו עם הצלבה בקצה |
| -) | קו מלא עם חץ חלול בקצה (אסינכרוני) |
| --) | קו מקווקו עם חץ חלול בקצה (אסינכרוני) |
הפעלה
ניתן להפעיל ולבטל הפעלה של תפקיד; ביטול ההפעלה או ההפעלה יכולים להיות הצהרה ייעודית:
העתק
הטמעה
sequenceDiagram
Alice->>Bob: Hello Bob, how are you?
activate Alice
Bob->>Alice: Hi Alice!
deactivate Alice
קיימת גם צורת כתיבה מקוצרת, כלומר הוספת + או - אחרי חץ ההודעה.
העתק
הטמעה
sequenceDiagram
Alice->>+John: Hello John, how are you?
John-->>-Alice: Great!
ניתן לצבור הפעלות של אותו תפקיד:
העתק
הטמעה
sequenceDiagram
Alice->>+John: Hello John, how are you?
Alice->>+John: John, can you hear me?
John-->>-Alice: Hi Alice, I can hear you!
John-->>-Alice: I feel great!
הערה
ניתן להוסיף הערות לתרשים הרצף. ניתן לעשות זאת באמצעות הסימונים הבאים: Note[right of] או [left of] או [over][משתתף]: תוכן ההערה
העתק
הטמעה
sequenceDiagram
participant John
Note right of John: Text in note
ניתן גם ליצור הערה המכסה שני משתתפים:
העתק
הטמעה
sequenceDiagram
Alice->John: Hello John, how are you?
Note over Alice,John: A typical interaction
תו מעבר שורה
ניתן להוסיף תווי מעבר שורה בהערות ובהודעות:
העתק
הטמעה
sequenceDiagram
Alice->John: Hello John,<br/>how are you?
Note over Alice,John: A typical interaction<br/>But now in two lines
תו מעבר שורה בשם תפקיד דורש הגדרת כינוי:
העתק
הטמעה
sequenceDiagram
participant Alice as Alice<br/>Johnson
Alice->John: Hello John,<br/>how are you?
Note over Alice,John: A typical interaction<n/>But now in two lines
לולאה
בתרשים רצף ניתן לבטא לולאה באמצעות הסימונים הבאים.
העתק
הטמעה
loop Loop text
... statements ...
end
ראו את הדוגמה שלהלן:
העתק
הטמעה
sequenceDiagram
Alice->John: Hello John, how are you?
loop Every minute
John-->Alice: Great!
end
חלופה
בתרשים רצף ניתן לבטא נתיב חלופי באמצעות סימונים.
העתק
הטמעה
alt Describing text...
statements
else
statements
end
或者如果存在可选序列:
העתק
הטמעה
opt Describing text...
statements
end
ראו את הדוגמה שלהלן:
העתק
הטמעה
sequenceDiagram
Alice->>Bob: Hello Bob, how are you?
alt is sick
Bob->>Alice: Not so good :(
else is well
Bob->>Alice: Feeling fresh like a daisy
end
opt Extra response
Bob->>Alice: Thanks for asking
end
מקבילי
ניתן להציג פעולות המתרחשות במקביל באמצעות הסימונים הבאים.
העתק
הטמעה
par Action 1
statements
and Action 2
statements
and Action N
statements
end
ראו את הדוגמה שלהלן:
העתק
הטמעה
sequenceDiagram
par Alice to Bob
Alice->>Bob: Hello guys!
and Alice to John
Alice->>John: Hello guys!
end
Bob-->>Alice: Hi Alice!
John-->>Alice: Hi Alice!
ניתן גם לקנן בלוקים מקבילים.
העתק
הטמעה
sequenceDiagram
par Alice to Bob
Alice->>Bob: Go help John
and Alice to John
Alice->>John: I want this done today
par John to Charlie
John->>Charlie: Can we do this today?
and John to Diana
John->>Diana: Can you help us today?
end
end
אזור קריטי
ניתן להציג פעולות שחייבות להתבצע אוטומטית על ידי התניה של מצבים שונים.
הדבר נעשה באמצעות הסימונים הבאים:
העתק
הטמעה
critical [Action that must be performed]
... statements ...
option [Circumstance A]
... statements ...
option [Circumstance B]
... statements ...
end
ראו את הדוגמה שלהלן:
העתק
הטמעה
sequenceDiagram
critical Establish a connection to the DB
Service-->DB: connect
option Network timeout
Service-->Service: Log error
option Credentials rejected
Service-->Service: Log different error
end
ייתכן גם שאין אפשרויות כלל.
העתק
הטמעה
critical Establish a connection to the DB
Service-->DB: connect
end
גם בלוק קריטי זה יכול להיות מקונן, בדומה להצהרת par שראינו לעיל.
הפסקה
ניתן לציין עצירה של הרצף בתהליך, המשמשת בדרך כלל למידול מצבי חריגה.
הדבר נעשה באמצעות הסימונים הבאים:
העתק
הטמעה
break [something happened]
... statements ...
end
ראו את הדוגמה שלהלן:
העתק
הטמעה
sequenceDiagram
Consumer-->API: Book something
API-->BookingService: Start booking process
break when the booking process fails
API-->Consumer: show failure
end
API-->BillingService: Start billing process
הדגשת רקע
ניתן להגדיר מלבן רקע צבעוני כדי להדגיש את התהליך, באמצעות הסימונים הבאים:
העתק
הטמעה
rect COLOR
... content ...
end
הצבע מוגדר באמצעות התחביר rgb ו-rgba.
העתק
הטמעה
rect rgb(0, 255, 0)
... content ...
end
העתק
הטמעה
rect rgba(0, 0, 255, .1)
... content ...
end
ראו את הדוגמה שלהלן:
העתק
הטמעה
sequenceDiagram
participant Alice
participant John
rect rgb(191, 178, 255)
note right of Alice: Alice calls John.
Alice->>+John: Hello John, how are you?
rect rgb(142, 182, 89)
Alice->>+John: John, can you hear me?
John-->>-Alice: Hi Alice, I can hear you!
end
John-->>-Alice: I feel great!
end
Alice ->>+ John: Did you want to go to the game tonight?
John -->>- Alice: Yeah! See you there.
הערה
ניתן להזין הערות בתרשים רצף, והעורך יתעלם מהן. ההערה חייבת לתפוס שורה נפרדת, וחייבת להתחיל בשני סימני אחוז %%. כל טקסט מתחילת ההערה ועד תו מעבר השורה הבא ייחשב כהערה, כולל כל תחביר תרשים.
העתק
הטמעה
sequenceDiagram
Alice->>John: Hello John, how are you?
%% this is a comment
John-->>Alice: Great!
קידוד ישויות להחלפת תווים
ניתן להחליף תווים באמצעות התחביר שלהלן.
העתק
הטמעה
sequenceDiagram
A->>B: I #9829; you!
B->>A: I #9829; you #infin; times more!
המספרים הנתונים הם עשרוניים, לכן (#) יכול להיות מקודד כ-(#35;). נתמך גם שימוש בשמות תווי HTML.
מכיוון שנקודה-פסיק יכולה להחליף תו מעבר שורה בהגדרת סימונים, כאשר טקסט ההודעה מכיל נקודה-פסיק יש להשתמש ב-(#59;).
מספור
ניתן לצרף מספר סידורי לכל חץ בתרשים הרצף. כפי שמוצג להלן:
העתק
הטמעה
sequenceDiagram
autonumber
Alice->>John: Hello John, how are you?
loop HealthCheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!
תפריט משתתפים
משתתפים יכולים לכלול תפריט קופץ, הכולל קישורים מותאמים אישית לדפים חיצוניים. לדוגמה, אם תפקיד מייצג שירות רשת, קישורים שימושיים עשויים לכלול קישור ללוח בקרה לבדיקת תקינות השירות, מאגר המכיל את קוד השירות, או קישור לדף ויקי המתאר את השירות.
ניתן להגדיר זאת על ידי הוספת שורת קישור אחת או יותר, בפורמט שלהלן:
העתק
הטמעה
link <actor>: <link-label> @ <link-url>
העתק
הטמעה
sequenceDiagram
participant Alice
participant John
link Alice: Dashboard @ https://dashboard.contoso.com/alice
link Alice: Wiki @ https://wiki.contoso.com/alice
link John: Dashboard @ https://dashboard.contoso.com/john
link John: Wiki @ https://wiki.contoso.com/john
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!
תחביר תפריט מתקדם
קיים תחביר מתקדם התלוי בפורמט JSON. אם אתה שולט היטב בפורמט JSON, ניתן להשתמש גם בו.
ניתן להגדיר זאת על ידי הוספת שורת קישור בפורמט שלהלן:
העתק
הטמעה
links <actor>: <json-formatted link-name link-url pairs>
示例如下:
העתק
הטמעה
sequenceDiagram
participant Alice
participant John
links Alice: {"Dashboard": "https://dashboard.contoso.com/alice", "Wiki": "https://wiki.contoso.com/alice"}
links John: {"Dashboard": "https://dashboard.contoso.com/john", "Wiki": "https://wiki.contoso.com/john"}
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!