Test QuickGV: Difference between revisions
Jump to navigation
Jump to search
| (160 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
See: https://graphviz.gitlab.io/_pages/pdf/dotguide.pdf | See: https://graphviz.gitlab.io/_pages/pdf/dotguide.pdf | ||
= | = Test = | ||
<quickmmd name="main" dump-env="true"> | |||
flowchart TD | |||
A --> B2 | |||
</quickmmd> | |||
= 認知負荷 = | |||
<quickmmd name="cognitive-load"> | |||
mindmap | |||
((認知負荷)) | |||
((熟能生巧<br>有效認知負荷<br>germane)) | |||
--> 數學解題突破盲腸 | |||
</ | --> 游泳換氣成功了 | ||
--> 繞口令不吃螺絲 | |||
((錯綜複雜<br>內在認知負荷<br>intrinsic)) | |||
--> 教材太難, 越級打怪 | |||
--> 基礎知識沒學好 | |||
((莫名其妙<br>外在認知負荷<br>extraneous)) | |||
--> 教材太多雜訊 | |||
--> 光罰寫就寫不完 | |||
</quickmmd> | |||
= | = Colored Edge = | ||
<quickmmd name="colored-edge" dump-env="true"> | |||
< | flowchart TD | ||
A1(["👩🏻💻 Human"]) | |||
A2(["🤖 Agent"]) | |||
B1("HTTP<br>(Fiber v3)") | |||
A -> | subgraph backend handlers | ||
B2("API handler") | |||
B3("MCP HTTP") | |||
B4("Streamable Handler") | |||
B5("SSE handler") | |||
B6("MCP Server") | |||
end | |||
subgraph backend services | |||
C1(Mermaid to SVG) | |||
C2(Mermaid to PNG) | |||
C3(XML Formatter) | |||
end | |||
subgraph frontend | |||
B7("Nuxt.js") | |||
end | |||
subgraph resources | |||
D1(Mermaid Container<br>yuzutech/kroki-mermaid) | |||
end | |||
%% human path | |||
A1 --> B1 | |||
B1 --> |the rest URI| B7 | |||
linkStyle 0,1 stroke:#0000ff,stroke-width:2px | |||
%% agent path | |||
A2 --> B1 | |||
B1 --> |/mcp or /sse| B3 | |||
linkStyle 2,3 stroke:#00aa00,stroke-width:2px | |||
%% api path | |||
B7 --> |axios| B1 | |||
B1 --> |/api| B2 | |||
linkStyle 4,5 stroke:#9900cc,stroke-width:2px | |||
B3 --> |/mcp| B4 | |||
B3 --> |/sse| B5 | |||
B4 & B5 --> B6 | |||
B6 --> C1 & C2 & C3 | |||
B2 --> D1 | |||
C1 & C2 --> D1 | |||
</quickmmd> | |||
= Dish = | |||
<quickmmd name="dish"> | |||
mindmap | |||
A[Dish] | |||
B1[Sauce Dish] | |||
B2[Shark's Fin Soup Dish] | |||
B3[Divided Dish] | |||
B4[Cassesrole Dish] | |||
</quickmmd> | |||
= MMD = | |||
<quickmmd name="testmmd"> | |||
flowchart LR | |||
Root("規則動詞變化<br>(play)") | |||
Root --> Past("過去") | |||
Root --> Pres("現在") | |||
Root --> Fut("未來") | |||
Past --> P1("過去普通: played") | |||
Past --> P2("過去進行: was/were playing") | |||
Past --> P3("過去完成: had played") | |||
Past --> P4("過去被動: was/were played") | |||
Pres --> R1("現在普通: play / plays") | |||
Pres --> R2("現在進行: am/is/are playing") | |||
Pres --> R3("現在完成: have/has played") | |||
Pres --> R4("現在被動: am/is/are played") | |||
Fut --> F1("未來普通: will play") | |||
Fut --> F2("未來進行: will be playing") | |||
Fut --> F3("未來完成: will have played") | |||
Fut --> F4("未來被動: will be played") | |||
</quickmmd> | |||
= WebSocket Service = | |||
<quickgv name="123" theme="warm" usage="ram"> | |||
subgraph cluster_client { | |||
label="WebSocket Client" | |||
c1[label="var ws = new WebSocket('/foo')"]; | |||
c2[label="ws.onerror = function (ev) ..."]; | |||
c3[label="ws.onopen = function (ev) ..."]; | |||
c4[label="ws.onmessage = function (ev) ..."]; | |||
c5[label="ws.send()"]; | |||
} | |||
subgraph cluster_server { | |||
label=""; | |||
s[label="Service Unit | <rh> Request Handler | <ph> Push Handler | <pw> Push Worker | <mh> Message Handler | <mw> Message Worker"]; | |||
iq[label="Inbound Queue"]; | |||
oq[label="Outbound Queue"]; | |||
} | |||
c1 -> s:rh [color="#ff0000"]; | |||
c2 -> s:rh [color="#0000ff",dir="back"]; | |||
c3 -> s:rh [color="#0000ff",dir="back"]; | |||
c4 -> s:ph [color="#0000ff",dir="back"]; | |||
s:ph -> oq [color="#0000ff",dir="back"]; | |||
s:pw -> oq [color="#0000ff"]; | |||
c5 -> s:mh [color="#ff0000"]; | |||
s:mh -> iq [color="#ff0000"]; | |||
s:mw -> iq [color="#ff0000",dir="back"]; | |||
</quickgv> | </quickgv> | ||
Latest revision as of 07:12, 6 October 2026
See: https://graphviz.gitlab.io/_pages/pdf/dotguide.pdf
Test
| File Path | /images/quickmmd/Test_QuickGV-main.svg |
|---|---|
| File Size | 10.54 KB |
| Last modified | 14:49:53 |
| Time of SVG loading | 0.00 second(s) |
| Time of SVG convertion | 0.00 second(s) |
| Cache Detected | Yes |
| SVG Engine | Kroki API |
| Kroki API URL | http://kroki:8000 |
| Mermaid syntax Reference | https://mermaid.js.org/intro/syntax-reference.html |
| QuickMMD Version | 1.0.0 - About QuickMMD |
認知負荷
Colored Edge
| File Path | /images/quickmmd/Test_QuickGV-colored-edge.svg |
|---|---|
| File Size | 116.69 KB |
| Last modified | 14:49:55 |
| Time of SVG loading | 0.00 second(s) |
| Time of SVG convertion | 0.00 second(s) |
| Cache Detected | Yes |
| SVG Engine | Kroki API |
| Kroki API URL | http://kroki:8000 |
| Mermaid syntax Reference | https://mermaid.js.org/intro/syntax-reference.html |
| QuickMMD Version | 1.0.0 - About QuickMMD |
Dish
MMD
WebSocket Service
testflow
test