圖表通常是解釋系統、工作流程、架構或業務流程最快的方式。然而，在圖表工具中重現現有圖表可能需要相當長的時間，尤其是當原始圖表僅以影像形式提供時。
Visual Paradigm 已升級VPasCode並新增基於影像的AI 圖表生成。您現在可以上傳圖表影像並搭配文字指令，讓 AI 根據視覺參考生成可編輯的圖表程式碼。
該影像可能是其他應用程式中建立的圖表、文件或網站的螢幕擷取畫面、書籍中的圖表，甚至是手繪草圖。您無需手動重建每個形狀、標籤和關係，而是可以使用 VPasCode 建立以「圖表即程式碼」格式為基礎的起點，並在瀏覽器中繼續編輯。
VPasCode 中的 AI 圖表生成是什麼？
VPasCode 是一個線上「圖表即程式碼」平台，可將基於文字的圖表語言和結構化資料轉換為視覺圖表。它支援多種常見格式，例如 PlantUML、Mermaid、Graphviz、Markmap、ECharts、JSON、YAML、XML、CSV、DBML、SQL 等。
在此次升級之前，AI 圖表生成功能主要依賴文字指令運作。例如，您可以輸入以下提示：
為保險系統生成 PlantUML 格式的用例圖。
VPasCode 接著會根據您的描述生成圖表程式碼。現在支援影像輸入，您可以同時提供視覺參考和自然語言指令。這使得重現現有圖表結構、將視覺概念轉換為可編輯程式碼，或將影像作為新圖表的起點變得更加容易。
例如，您可以上傳序列圖並輸入：
根據提供的影像生成 PlantUML 格式的序列圖。
VPasCode 會分析上傳的影像、解讀圖表結構，並生成可在編輯器中渲染的程式碼。接著您可以檢視結果、調整程式碼，並微調圖表以符合您的需求。
如何從影像生成圖表程式碼
從影像建立 AI 生成圖表僅需幾個步驟。
- 開啟 AI 生成。在 VPasCode 中，點擊AI 生成位於應用程式頂部。AI 生成對話方塊將會出現。
- 上傳您的圖表影像。點擊上傳影像位於對話方塊底部，並從您的電腦選擇影像。您也可以將影像複製到剪貼簿，然後按下Ctrl+V將其直接貼上至對話框。
- 輸入指令。描述您希望 VPasCode 生成什麼內容，並指定所需的圖形語言或格式。例如：根據提供的圖片，使用 PlantUML 生成序列圖。
- 點擊「AI 生成」。VPasCode 會處理圖片與指令，接著生成圖形程式碼。
- 檢視並編輯結果。生成的程式碼會顯示在 VPasCode 編輯器的左側，而渲染後的圖形則顯示在右側。您可以編輯程式碼，並即時看到視覺結果的更新。
此工作流程讓您享有 AI 圖形生成的速度，同時保留「圖形即程式碼」的彈性。生成的結果並非僅能檢視的靜態圖片，而是可編輯的程式碼，您可以進行精修、擴充、分享與重複使用。
您可以使用哪些圖片？
當您的圖形以視覺形式存在但並非可編輯的圖形格式時，圖片輸入功能非常實用。可能的來源包括：
- 在其他圖形應用程式中建立的圖形螢幕擷取畫面
- 從技術書籍、文章或網站複製的圖片
- 專案文件中包含的架構圖
- 白板照片
- 手繪的流程圖與系統草圖
- 由客戶或利害關係人提供的參考圖片
- 僅以 PNG、JPG、GIF 或其他圖片格式提供的舊版圖形
- 用作新模型視覺啟發的概念圖
圖片品質與可讀性會影響生成結果。為獲得最佳效果，請使用標籤清晰可讀、對比良好且連接線清晰可見的圖片。若原始圖形複雜，您可能透過先生成初始版本，再透過額外指令或手動程式碼編輯進行精修，以獲得更佳結果。
為何要使用從圖片進行的 AI 圖形生成？
將靜態視覺內容轉換為可編輯的圖形程式碼
圖形圖片對於檢視與分享很有用，但難以維護。您無法輕鬆地重新命名元素、新增新關聯、變更佈局，或在 PNG 檔案中追蹤修訂記錄。
AI 圖形生成提供了一種實用方法，可將靜態視覺參考轉換為可編輯的圖形程式碼。一旦生成，即可使用 PlantUML、Mermaid、Graphviz 或其他支援格式來更新圖形。
重複使用來自不同來源的圖形
傳統匯入工作流程通常要求特定的檔案格式。若圖形是在不支援所需匯出格式的應用程式中建立的，則手動重新建立可能是唯一選項。
透過基於圖片的 AI 圖形生成，原始建立工具的重要性較低。您可以使用螢幕擷取畫面、下載的參考圖片或拍攝的草圖，作為 VPasCode 圖形的起點。
減少重複性手動工作
手動重建圖形涉及識別每個參與者、實體、元件、標籤、連接線與關聯。此外，還需要排列這些元素，並檢查最終結果是否傳達了與原始圖形相同的概念。
AI 可協助快速產生圖形程式碼的首版。您無需從空白編輯器開始，而是從已生成的結構出發，進行檢視與改進。
讓程式碼繪圖更易於使用
程式碼繪圖提供重要優勢：圖表可以以文字形式編輯、與原始碼一起儲存、透過變更進行審查，並在底層模型演進時重新生成。然而，學習語法可能成為新用戶的障礙。
AI 圖表生成有助於縮小視覺建模與圖表程式碼之間的差距。用戶可以從一張圖片和自然語言指令開始，然後在 VPasCode 編輯器中學習並優化生成的程式碼。
在建立新圖表時保留視覺參考
您不必完全複製一張圖片。上傳的圖片也可作為建立修改版或擴充版圖表的參考。
例如，您可以提供現有的系統架構圖片，並要求 VPasCode 生成一個 PlantUML 圖表，該圖表可新增支付服務、區分外部系統，或將架構重新組織為邏輯層級。
VPasCode：不僅是 AI 圖表生成工具
AI 圖表生成只是 VPasCode 體驗的一部分。VPasCode 是為開發人員、架構師、技術撰寫人員和專案團隊設計的完整程式碼繪圖工作區。
自動格式偵測
VPasCode 可從您貼上到編輯器的內容中偵測圖表或資料格式。這減少了在查看結果前手動設定語言的需求。
即時圖表預覽
當您編輯生成的程式碼時，渲染後的圖表會在預覽面板中即時更新。這使得測試變更、修正標籤、新增關聯以及改善圖表佈局變得更加輕鬆。
支援常見的圖表語言
您可以使用 VPasCode 建立 PlantUML、Mermaid、Graphviz、D2、Markmap 和 ECharts 圖表。支援的圖表類別包括用例圖、序列圖、類別圖、活動圖、元件圖、部署圖、狀態圖、ER 圖、流程圖、心智圖、甘特圖、C4 圖等。
AI 程式碼修改
生成圖表後，您可以繼續與 AI 合作，要求它修改程式碼。例如，您可以要求它新增新參與者、引入異常流程、按子系統組合元件，或簡化複雜圖表。
AI 錯誤修正
如果生成的或手動編輯的程式碼包含語法問題，VPasCode 可以協助修正。AI 錯誤修正功能可建議修正方案並顯示程式碼差異，讓您了解變更內容。
原生圖表翻譯
圖表標籤也可以翻譯成其他語言。這對於需要為國際用戶、客戶或專案辦公室準備技術圖表的團隊非常有用。
分享與匯出
一旦圖表準備就緒，您可以透過 URL 或 QR 碼分享，或將其匯出為 PNG 或 SVG 影像。當您需要用於文件、簡報或大型顯示的可縮放圖表時，SVG 匯出特別有用。
將生成的圖表連接到 Visual Paradigm 生態系統
VPasCode 也連接到更廣泛的 Visual Paradigm 生態系統。這意味著 AI 生成的圖表可以成為更廣泛的文件與建模工作流程的一部分，而不僅僅是孤立的線上影像。
使用 OpenDocs 記錄圖表
您可以將圖表傳送至 OpenDocs 管線，並在文件頁面中重複使用。這使得將生成的圖表與說明、需求、設計決策、使用者故事及其他技術內容結合變得更加容易。
保持圖表與文件的連結也能減少文件維護工作。當圖表變更時，您可以更新圖表原始碼並透過管線傳送最新版本，而不必從頭重新建立文件資產。
使用 Visual Paradigm Desktop 繼續進行視覺建模
如果您需要更深入的視覺建模功能，請將圖表傳送至管線，並將其匯入 Visual Paradigm Desktop 作為新圖表。這使您能夠使用 VPasCode 進行快速的圖表程式碼生成，並使用 Visual Paradigm Desktop 進行更廣泛的建模與專案工作。
使用 Visual Paradigm Online 修飾圖表
您也可以在 Visual Paradigm Online 中繼續編輯您的圖表。請點擊「在 VP Online 中編輯」位於圖表檢視器右下角，以開啟圖表進行進一步的視覺編輯與精進。
從靜態圖像參考到動態圖表
此工作流程最重要的好處在於，它改變了您對現有圖表圖像所能進行的操作。
過去，圖像通常是圖表的最終形式。您可以查看、下載或將其置於文件中，但進行修改通常需要存取原始來源檔案或完全重繪。
透過基於圖像的 AI 圖表生成，圖像可成為新圖表即程式碼工作流程的起點：「
- 從現有圖像或手繪概念開始。
- 使用 AI 生成可編輯的圖表腳本。
- 檢視生成的程式碼與渲染結果。
- 修正標籤、關係與佈局細節。
- 請 AI 修改或擴充圖表。
- 分享、匯出、記錄或繼續對結果進行建模。
當團隊接手舊有文件、在工具間遷移圖表，或需要將非正式構想轉化為結構化的技術模型時，此方法尤為實用。
獲得更佳 AI 生成圖表的建議
- 使用清晰的圖像：「解析度較高且文字可讀的圖像通常能提供較佳的參考。
- 指定圖表類型：「說明您是否需要序列圖、用例圖、流程圖、類別圖、元件圖或其他格式。
- 指定目標語言：「在您的指示中包含 PlantUML、Mermaid、Graphviz 或其他支援的格式。
- 描述預期結果：「說明您是否需要精確重現、簡化版本或擴充圖表。
- 檢視生成的標籤：「螢幕截圖與手寫圖像中的文字可能需要手動修正。
- 分階段生成複雜圖表：「對於大型圖表，先建立第一版，然後請 AI 新增或重新組織特定區塊。
- 使用即時預覽：「在編輯程式碼時檢查渲染後的圖表，以發現遺漏的關係或意外的佈局變更。
- 保留程式碼作為來源：「一旦圖表正確，請保留所生成的程式碼，以便未來更新更為輕鬆。
誰能從基於影像的 AI 圖表生成中受益？
軟體開發人員
開發人員可將架構草圖、序列參考和舊版螢幕擷取畫面轉換為可編輯的圖表，並與技術程式碼及文件一同維護。
軟體架構師
架構師可利用影像參考，為系統情境圖、元件圖、部署圖及 C4 模型建立結構化的起始點。
業務分析師
業務分析師可將流程草圖或工作流程影像轉換為可編輯的流程圖與活動圖，再與利害關係人共同優化結果。
技術文件撰寫人員
技術文件撰寫人員可將視覺參考轉換為可重複使用的圖表程式碼，並將生成的圖表納入 OpenDocs 或其他專案文件中。
學生與教育者
學生可利用 AI 圖表生成功能，探索視覺圖表如何對應至 PlantUML 或 Mermaid 語法。教育者則可將參考圖表作為範例，用於涉及 UML、系統分析、軟體架構或流程建模的課程。
在不同工具間遷移的團隊
正在更換圖表應用程式的團隊，可在原始可編輯檔案無法取得或無法直接匯入時，將影像輸入作為實用的遷移輔助工具。
使用 VPasCode 開始建立圖表
VPasCode 將 AI 圖表生成、程式碼即圖表編輯、即時渲染、程式碼修改、錯誤修正、分享、匯出以及 Visual Paradigm 整合功能，整合於單一線上工作區中。
無論您是以文字構想、現有圖表影像、螢幕擷取畫面或手繪草圖為起點，VPasCode 都能協助您更快地從視覺概念轉換為可編輯的圖表程式碼。
開啟 VPasCode 編輯器並嘗試使用 AI 圖表生成功能，用於您的下一個架構圖、工作流程、UML 模型或技術插圖。
常見問題
什麼是 AI 圖表生成？
AI 圖表生成是一項利用自然語言指令建立圖表程式碼的功能。在 VPasCode 中，您亦可上傳影像，並要求 AI 根據視覺參考生成圖表程式碼。
VPasCode 能否從螢幕擷取畫面生成圖表程式碼？
可以。您可以上傳圖表的螢幕擷取畫面，並提供說明圖表類型與預期輸出格式的指令。VPasCode 隨後將生成程式碼，您可於線上編輯器中檢視與編輯。
我可以貼上影像而非上傳嗎？
可以。將影像複製到剪貼簿，然後按下Ctrl-V於 AI 生成對話框中，即可直接貼上影像。
我可以使用哪些圖表語言？
VPasCode 支援多種圖表與視覺化格式，包括 PlantUML、Mermaid、Graphviz、D2、Markmap 與 ECharts。最佳格式取決於您欲建立的圖表類型，以及您計劃後續如何使用它。
我可以編輯生成的圖表嗎？
可以。生成的圖表以可編輯的程式碼形式呈現。您可以直接修改程式碼，使用 AI 請求變更，並即時檢視更新後的圖表。
AI 圖表生成對於手繪圖表有幫助嗎？
是的。手繪草圖可提供有用的視覺參考，特別適用於工作流程、系統構想、流程圖及早期架構討論。清晰的書寫與良好的照明能讓結果更易於精修。
生成圖表後我可以做什麼？
您可以繼續編輯程式碼、修正語法問題、翻譯標籤、將圖表匯出為 PNG 或 SVG 格式、分享圖表、傳送至 OpenDocs、匯入 Visual Paradigm Desktop，或在 Visual Paradigm Online 中編輯。