簡介

在現代軟體工程中，「圖形即程式碼」（DaC）方法已徹底改變了我們記錄系統架構的方式。VPasCode由 Visual Paradigm 開發，VPasCode 是一款統一的瀏覽器基礎平台，支援 PlantUML、Mermaid 和 Graphviz 等多種語法。雖然撰寫程式碼來產生圖形能提供精確度，但手動更新複雜結構（例如為多個子類別新增屬性）可能相當繁瑣。

VPasCode 以 AI 驅動的圖表即程式碼工作流程，比較手動編碼與對話式 UML 類別圖的細化過程。

這正是VPasCode 的內建 AI大放異彩之處。透過將自然語言處理直接整合至編輯器中，VPasCode 讓開發人員能以對話方式優化工業標準視覺模型。本指南將探討如何運用「AI 修改」功能，即時更新UML 類別圖，無需離開工作區即可填補文字程式碼與視覺設計之間的差距。

關鍵概念

在深入步驟之前，了解所涉及的關鍵技術會很有幫助：

圖形即程式碼（DaC）：一種方法論，圖形由文字基礎的原始碼產生，而非以滑鼠手動繪製。這確保圖形可進行版本控制且易於重複產生。
PlantUML：一個廣受歡迎的開源工具，使用簡潔的文字描述來建立 UML 圖形。在下方的範例中，PlantUML 語法定義了如客戶, 訂單、付款.
內建 AI 修改：與需要反覆複製貼上程式碼的外部 AI 工具不同，VPasCode 的內建 AI 能理解您目前檔案的上下文。它會解析您現有的 PlantUML 程式碼，套用您要求的變更（例如新增屬性），並自動重新編寫程式碼。
即時渲染：VPasCode 提供分割畫面視圖，左側程式碼的變更會立即反映在右側的視覺圖形上，確保即時回饋。

逐步指南：使用 VPasCode 內建 AI 優化工業標準類別圖

在 VPasCode 內，無需借助外部工具即可透過內建的 AI 功能，以幾個簡單步驟快速且方便地精簡類別圖。

起始點

假設您已使用 PlantUML 定義了一個基本的電子商務類別圖。您擁有一個付款類別，其下有三個子類別：現金, 支票，以及信用卡。目前，這些子類別僅為空殼，僅從父類別繼承。

（註：在實際介面中，這對應於提供的第一張圖片，左側顯示程式碼，右側顯示渲染後的類別圖，其中子類別為空。）

VPasCode 介面顯示一個基本的電子商務 PlantUML 類別圖，其中包含空的 Cash、Check 與 Credit 子類別。
圖 1：VPasCode 中類別圖的初始狀態。請注意現金, 支票，以及信用卡類別缺乏特定屬性。

步驟 1：開啟 AI 選單

要開始精簡流程，請在編輯器介面中找到 AI 控制項。

點擊AI下拉按鈕，該按鈕位於程式碼編輯器上方的左上角區域。此選單是您進行智慧圖形操作的入口。

VPasCode 介面顯示 AI 下拉選單，已選擇「修改」與「翻譯」選項。

圖 2：點擊 AI 下拉選單可顯示修改或轉換圖形程式碼的選項。

步驟 2：選擇修改選項

AI 選單根據您的需求提供不同的功能。若需進行結構變更，請使用修改功能。

從下拉選單中，點擊修改選項，其旁附有 AI 圖示。這表示您打算修改現有圖形的邏輯與結構，而非從頭開始生成新內容。

步驟 3：描述所需的變更

這是最關鍵的步驟，在此步驟中自然語言取代了手動編碼。您無需知道新屬性的精確 PlantUML 語法；只需描述您想要的內容即可。

在「AI 修改」對話方塊中，輸入自然語言描述，說明您希望如何精細化或變更您的圖表。
範例提示： 「在類別圖中，為 Payment 類別的子類別新增一些屬性」
點擊「AI 修改」按鈕以提交您的請求。

VPasCode AI 修改對話方塊，顯示提示以在 UML 圖表中為 Payment 類別的子類別新增屬性。 圖 3：AI 修改對話方塊。使用者輸入自然語言提示（1）並觸發處理程序（2）。

步驟 4：檢視精細化後的圖表

提交提示後，VPasCode 引擎即開始運作。它會分析請求，識別目標類別（現金, 支票, 信用卡），並根據標準領域知識注入相關的屬性與方法。

AI 將自動處理您的描述，更新程式碼，並直接在您的視覺化類別圖中反映新增的類別、屬性或方法。
結果：如以下所示，「現金」類別現在擁有「cashTendered」，「支票」類別擁有「bankID」與「銀行名稱，以及信用類別包含編號 和 有效日期。左側的程式碼已更新以與右側的視覺化內容相符。

VPasCode 以 AI 生成的 UML 類別圖，顯示已更新的 Cash、Check 與 Credit 類別，包含新屬性與方法。

圖 4：精煉後的圖表。AI 已成功將相關屬性與方法填入子類別，同時更新了程式碼與視覺化呈現。

結論

將 AI 整合至 VPasCode 等「程式碼即圖表」工具，為軟體架構師與開發人員帶來生產力的顯著提升。遵循此簡易的四步驟流程，您即可在數秒內將骨架類別圖轉換為詳細的設計文件。

能夠輸入「為 Payment 的子類別新增屬性」並即時觀察程式碼與圖表同步更新，徹底消除了手動編輯語法的困擾。無論您是在建模複雜的企業系統或簡單的應用程式，VPasCode 內建的 AI 都能確保您的文件隨您的構想同步演進。

準備親自嘗試嗎？請造訪VPasCode，即刻將您的文字轉換為專業圖表

Visual Paradigm VPasCode 參考文章與資源

以下為精選的 VPasCode 相關文章與資源清單。VPasCode 是一個統一的文字轉圖表平台，這些資源已分類整理，協助您理解其核心功能、AI 特性及生態系整合。

核心指南與功能概覽

Visual Paradigm VPasCode 完整指南：一本基礎指南，闡述「程式碼即圖表」（DaC）的理念、其多引擎架構（PlantUML、Mermaid、Graphviz），以及核心的雙面板編輯器介面。
掌握 VPasCode：AI 驅動圖表即程式碼的終極指南：深入探討如何利用 AI 驅動的功能，包括用於自然語言轉圖表的 AI 聊天機器人，以及如何將 AI 生成的圖表直接匯入 VPasCode 編輯器。
VPasCode 深度解析：在單一平台整合 Mermaid、PlantUML 與 AI：本文深入技術層面，探討平台對 Mermaid、PlantUML 與 Graphviz 的支援，並提供詳細的功能比較與實際應用案例。

快速入門與實用指南

60 秒快速入門指南 | VPasCode 文字轉圖表指南：透過雲端原生編輯器，在不到一分鐘內逐步建立、自訂並分享您的第一張圖表。
從程式碼到清晰呈現：VPasCode 與 OpenDocs 無縫圖表繪製初學者指南：一份實用的逐步指南，介紹如何建立真實的圖表（序列圖、C4 模型、類別圖），並透過 Pipeline 整合功能將它們從 VPasCode 發送至 OpenDocs 文件。

整合與生態系

無縫連接圖表與文件：VPasCode 與 OpenDocs 整合：宣布直接 Pipeline 整合，詳細說明如何透過「發送至 OpenDocs Pipeline」將圖表轉化為動態文件。
透過 OpenDocs 無縫連接程式碼圖表與文件：說明 VPasCode 如何作為圖表建立與文件之間的橋樑，透過即時更新功能解決圖表過時的問題。

AI 功能與案例研究

Visual Paradigm – AI 驅動的視覺化建模：展示 Visual Paradigm 更廣泛的 AI 生態系，包含專為 VPasCode 設計的章節，介紹其從文字生成圖表的能力，以及 AI 錯誤修正功能。
VPasCode 新功能 – 發布功能總覽：發布總覽，重點介紹關鍵功能：多語法支援、AI 程式碼錯誤修正、AI 翻譯以服務全球團隊，以及 OpenDocs 整合。
案例研究：透過 VPasCode 加速軟體架構文件編製：一項案例研究，展示 VPasCode 如何透過自動佈局、AI 生成與統一引擎支援，加速軟體架構文件的編製。

官方產品頁面

Visual Paradigm VPasCode：統一的圖表即程式碼平台：官方產品功能頁面，詳細說明支援的圖表類型（PlantUML、Mermaid、Graphviz）、核心技術功能與常見問題解答。
VPasCode 官方文件與遊樂場：中央入口，可存取免費的 VPasCode Playground 編輯器、官方文件，以及平台最新更新資訊。

簡介