繁中
English繁中

基於人工智慧技術的Web應用

作者: /

聰明的美人魚，是一個基於人工智慧的Web應用程式，可以智能地將文本內容轉換為美人魚格式的代碼，並將其呈現為視覺圖表。

項目概況

  • 功能：添加自然語言文本或上傳 .txt、.md、.docx 文件內容通過人工智慧自動轉換為美人魚代碼，並實時渲染為視覺圖表（例如流程圖、序列圖、日曆圖、狀態圖等）
  • 目的：幫助用戶擺脫手寫美人魚代碼的繁瑣，一鍵從文本描述生成標準圖表代碼，提高生產效率

核心功能亮點

  1. 智能文本解析
    • 支持多達約20，000個字符的輸入和文件上傳。
    • AI自動識別或手動選擇圖表類型，生成美人魚代碼並支持流媒體預覽
  2. 雙重渲染模式
    • 美人魚渲染器：支持縮放和專業視圖控制的標準圖表。
    • Excalidraw渲染器：更像手繪圖形，支持拖放和風格調整
  3. 實時代碼編輯
    • 使用CodeMirror集成編輯器支持Mermaid語法突出顯示、驗證和實時反饋
  4. 人工智慧無障礙性
    • 自動修復：AI檢測Mermaid語法錯誤並提供修復建議。
    • 方向切換：支持橫向（LR）和縱向（TD）布局之間的一鍵切換
  5. 出口和分享
    • 支持將圖表輸出到JPEG、PNG，或複製Mermaid原始碼

使用和配置

  • 免費體驗：您可以直接訪問在線演示（smart-mermaid.aizhi.site），每天有5次免費積分生成時間，並內置API Key支持
  • 密碼模式：輸入作者提供的訪問密碼，即可無限次使用。
  • 定製人工智慧服務：支持使用您自己配置的OpenAI或其他服務API來實現無限通話

技術棧

  • 使用 Next.js(App路由器），順風CSS、陰影/ui +基數UI 構建前端界面。
  • 渲染依賴性 美人魚 和 @excalidraw/excalidraw轉換依賴 @excalidraw/mermaid-to-excalidraw。
  • 集成 CodeMirror 編輯器與 猛獁 文件解析。
  • 人工智慧支持框架與OpenAI API兼容。
  • Docker和Docker編寫一鍵部署支持

🛠使用過程簡要描述

  1. 輸入文本或上傳文件。
  2. 選擇圖表類型或自動識別。
  3. 點擊「生成」，AI實時輸出美人魚代碼和圖形預覽。
  4. 如果需要修改或輸出，請在編輯器中進行調整並輸出到JPEG/PNG或複製代碼。

📝摘要

Smart Mermaid簡化了從文本到圖表的流程，利用AI自動生成標準Mermaid代碼，支持實時編輯、雙重渲染、修復優化和輸出，非常適合文檔編寫、項目管理和教學可視化場景。如果您經常需要使用美人魚來畫畫，這個工具可以大大提高您的效率。

Github：https://github.com/liujuntao123/smart-mermaid

輸油管：

返回頂端