Test QuickGV: Difference between revisions

From Fundamental Ramen
Jump to navigation Jump to search
 
(84 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


= WebSocket Service =
= Colored Edge =
<quickgv name="123" theme="warm" usage="ram">
 
subgraph cluster_clients {
<quickmmd name="colored-edge">
   c1[label="var ws = new WebSocket('/foo')"];
flowchart TD
   c2[label="ws.onopen = function (ev)"];
   A1(["👩🏻‍💻 Human"])
  c3[label="ws.onmessage = function (ev)"];
   A2(["🤖 Agent"])
  c4[label="ws.send()"];
}


s[label="Service Unit | <req> Request Handler | <push> Push Handler | <msg> Message Handler"];
  B1("HTTP<br>(Fiber v3)")


subgraph cluster_queues {
  subgraph backend handlers 
  iq[label="Inbound Queue"];
    B2("API handler")
  oq[label="Outbound Queue"];
    B3("MCP HTTP")
}
    B4("Streamable Handler")
    B5("SSE handler")
    B6("MCP Server")
  end


c1 -> s:req;
  subgraph backend services
c2 -> s:req;
    C1(Mermaid to SVG)
c3 -> s:push;
    C2(Mermaid to PNG)
c4 -> s:msg;
    C3(XML Formatter)
s:push -> oq;
  end
s:msg -> iq;


/*
  subgraph frontend
subgraph cluster_services {
    B7("Nuxt.js")
  s1[label="cast service"];
   end
  s2[label="monitor service"];
   s3[label="simple service"];
}


subgraph cluster_queue {
  subgraph resources
  q1[label="outbound queue"];
    D1(Mermaid Container<br>yuzutech/kroki-mermaid)
   q2[label="inbound queue"];
   end
}


subgraph cluster_worker {
  %% human path
   w1[label="cast worker"];
   A1 --> B1
   w2[label="handler worker", constraint=false];
   B1 --> |the rest URI| B7
}
  linkStyle 0,1 stroke:#0000ff,stroke-width:2px


c1 -> w1 -> q1 -> s1;
  %% agent path
s2 -> q2 -> w2 -> c2;
  A2 --> B1
*/
  B1 --> |/mcp or /sse| B3
</quickgv>
  linkStyle 2,3 stroke:#00aa00,stroke-width:2px


= 建議線路 gen1 =
  %% api path
<quickgv name="topology" theme="warm">
  B7 --> |axios| B1
subgraph cluster_clinic {
  B1 --> |/api| B2
   label="診間網路";
   linkStyle 4,5 stroke:#9900cc,stroke-width:2px


   his[label="HIS Server"];
   B3 --> |/mcp| B4
   nas[label="NAS"];
   B3 --> |/sse| B5
   opd[label="診間"];
   B4 & B5 --> B6
   pt[label="復健"];
   B6 --> C1 & C2 & C3
   reg[label="掛號"];
   B2 --> D1
   tv[label="衛教"];
   C1 & C2 --> D1
  prn[label="印表機"];
</quickmmd>
  sw[label="辦公室交換器"];
  fw[label="防火牆"];
  wan1[label="固定IP線路"];
  wan2[label="健保局 VPN"];
  cross[label="跨院病歷"];


  {opd pt reg tv his nas prn} -> sw;
= Dish =
   sw -> fw;
<quickmmd name="dish">
  fw -> {wan1 wan2};
mindmap
  wan1 -> cross [dir="back", color="#ff0000"];
   A[Dish]
}
    B1[Sauce Dish]
    B2[Shark's Fin Soup Dish]
    B3[Divided Dish]
    B4[Cassesrole Dish]
</quickmmd>


// 開放網路
= MMD =
subgraph cluster_open {
  label="開放網路";


  gu[label="新光保全"];
<quickmmd name="testmmd">
  mo[label="監視系統"];
flowchart LR
  pc1[label="外網專用PC"];
    Root("規則動詞變化<br>(play)")
  rt[label="IP分享器"];
  wan3[label="浮動IP線路"];
  mobile[label="監視系統 App"];
  hacker[label="駭客 or 殭屍電腦"];


  {pc1 gu mo} -> rt -> wan3;
    Root --> Past("過去")
  wan3 -> {mobile hacker} [label="tcp:3880", dir="back", color="#ff0000"];
    Root --> Pres("現在")
}
    Root --> Fut("未來")
</quickgv>


= 建議線路 gen2 =
    Past --> P1("過去普通: played")
    Past --> P2("過去進行: was/were playing")
    Past --> P3("過去完成: had played")
    Past --> P4("過去被動: was/were played")


<quickgv name="topology_gen2" theme="warm">
    Pres --> R1("現在普通: play / plays")
subgraph cluster_clinic {
    Pres --> R2("現在進行: am/is/are playing")
  label="診間網路";
    Pres --> R3("現在完成: have/has played")
    Pres --> R4("現在被動: am/is/are played")


  his[label="HIS Server"];
    Fut --> F1("未來普通: will play")
  nas[label="NAS"];
    Fut --> F2("未來進行: will be playing")
  opd[label="診間"];
    Fut --> F3("未來完成: will have played")
  pt[label="復健"];
    Fut --> F4("未來被動: will be played")
  reg[label="掛號"];
</quickmmd>
  tv[label="衛教"];
  prn[label="印表機"];
  fw[label="防火牆"];
  wan1[label="固定IP線路"];
  wan2[label="健保局 VPN"];
  cross[label="跨院病歷"];


  subgraph cluster_switch {
= WebSocket Service =
    label="網路交換器";
    vlan1[label="診間區虛擬網路"];
    vlan2[label="敏感區虛擬網路"];
  }


   {opd pt reg tv prn} -> vlan1;
<quickgv name="123" theme="warm" usage="ram">
   {his nas} -> vlan2;
subgraph cluster_client {
   {vlan1 vlan2} -> fw;
   label="WebSocket Client"
   fw -> {wan1 wan2};
   c1[label="var ws = new WebSocket('/foo')"];
   wan1 -> cross [dir="back", color="#ff0000"];
   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 {
subgraph cluster_open {
   label="";
   label="開放網路";
   s[label="Service Unit | <rh> Request Handler | <ph> Push Handler | <pw> Push Worker | <mh> Message Handler | <mw> Message Worker"];
 
   iq[label="Inbound Queue"];
   gu[label="新光保全"];
   oq[label="Outbound Queue"];
   mo[label="監視系統"];
   pc1[label="外網專用PC"];
  rt[label="IP分享器"];
  wan3[label="浮動IP線路"];
  mobile[label="監視系統 App\n(僅限特定地點存取)"];
 
  {pc1 gu mo} -> rt -> wan3;
  wan3 -> mobile [label="tcp:3880", dir="back", color="#ff0000"];
}
}
</quickgv>
= A =
<quickgv name="Gff" theme="warm">
rankdir=TB;
A [label="驗證銷售權"];
B [label="驗證輸入值格式"];
C [label="驗證報價是否存在"];
D [label="產生 GDS 訂單"];
E [label="產生供應商訂單"];


A -> B -> C -> D -> E;
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 10:42, 10 September 2026

See: https://graphviz.gitlab.io/_pages/pdf/dotguide.pdf

Colored Edge

Dish

MMD

WebSocket Service

testflow

test

Crawling Flow

GDS

Geomancer

Sandbox