สามารถสร้างแผนภาพโดยใช้ Mermaid ซึ่งเป็นเครื่องมือที่ใช้ในการสร้างแผนภาพ แผนผัง หรือ Flow Chart
สามารถส่งภาพ Diagram ที่ต้องการสร้างมาให้ทีม IT ช่วยสร้างได้
หลังได้โค้ดจาก Editor แล้ว ให้นำมาใส่ในหน้าเนื้อหา
เปลี่ยน Web Editor เป็น Markdown Mode
วางโค้ด Mermaid ลงในหน้าเนื้อหา
เริ่มด้วย ```mermaid และจบด้วย ```สามารถคัดลอกโค้ดด้านล่างไปวาง แล้วคัดลอกโค้ดจาก Editor แล้ววางแทนบรรทัดกลางได้เลย```mermaid
// Your mermaid code block here
```
หลังกลับมา Visual Mode จะเห็นเป็น Code Block ดังรูปด้านล่าง
เมื่อ Publish แล้ว จะเห็นในหน้าเนื้อหาจริงเป็นแผนภาพตามโค้ดที่เขียนไว้ ไม่ต้องกังวลว่าจะแสดงเป็นโค้ด
ตัวอย่าง
โค้ดที่เพิ่มในหน้า Markdown Mode
```mermaid
flowchart TB
subgraph pre[ตรวจโครงการ]
sec(เลขาฯ ตรวจ
format และภาษา)
so(S&O ตรวจ objective)
rd(R&D ตรวจตัวชี้วัด)
end
subgraph committee[พิจารณาโครงการ]
check{ที่ประชุมพิจารณาโครงการ}
reject([สพศ.และประธานโครงการ
หาแนวทางแก้ไขร่วมกัน])
pass([ส่งงานกิจ])
end
prereject(ถ้าต้องมีการปรับ objective
หรือตัวชี้วัด S&O และ R&D
จะมีการพูดคุยและหาแนวทาง
แก้ไขร่วมกับประธานโครงการ)
member@{ shape: comment, label: "นายก, อุปฯบริหาร,
Finance, อุปฯอื่นที่เกี่ยวข้อง" }
sec --> rd
so --> rd
rd --> check
check -- ที่ประชุมไม่อนุมัติ --> reject
check -- ที่ประชุมอนุมัติ --> pass
pre -.-> prereject
committee ~~~ member
```