📝工具簡介
Draw flowcharts with the open-source Mermaid diagram engine.
✨功能特點
- 七種圖表類型一鍵切換
- 實時渲染（500ms 防抖）
- Tab 鍵縮進，編輯體驗流暢
- 自動保存到本地，刷新不丟失
- 跟隨深色 / 淺色主題
- 導出 SVG 與 PNG
- 純前端運行，數據不上傳
- 移動端響應式佈局
🎯使用場景
- 梳理業務流程與決策分支
- 繪製接口調用時序圖
- 規劃項目開發甘特圖
- 設計數據庫 ER 模型
- 描述對象類與繼承關係
- 梳理訂單狀態機流轉
- 可視化數據佔比餅圖
- 編寫技術文檔與方案
💬常見問題
Mermaid 代碼寫錯了沒有渲染怎麼辦？
預覽區下方會顯示紅色的錯誤提示信息，包含出錯位置與原因，根據提示修正代碼後會自動重新渲染。
導出的 PNG 背景是什麼顏色？
PNG 會跟隨當前主題：淺色模式下背景為白色，深色模式下背景為深色，方便直接粘貼到對應主題的文檔中。
我的代碼會被保存嗎？
會。編輯內容會自動保存到瀏覽器 localStorage，下次打開同一頁面時自動恢復，數據僅存在本地。
支持哪些圖表類型？
目前支持流程圖（flowchart）、時序圖（sequence）、甘特圖（gantt）、類圖（class）、狀態圖（state）、ER 圖（er）和餅圖（pie）共七種，點擊頂部標籤可加載對應示例。