सीक्वेंस डायग्राम
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!
