在現代數據驅動的環境中，創建引人入勝且具備互動性的數據視覺化，對於有效的故事講述與決策至關重要。Apache ECharts 是實現此目標的強大工具，但從頭開始手動構建其複雜的 JSON 配置，往往是一項艱鉅且耗時的任務。Visual Paradigm 透過彌合自然語言構思與精確程式碼自訂之間的差距，完美解決了這一挑戰。
簡介
透過將智能 AI 聊天機器人 (AI Chatbot) 與 VPasCode (Visual Paradigm as Code) 整合，用戶現在可以無縫地生成、微調和發布互動式 ECharts。這份綜合指南將引導您完成完整的三階段工作流程，展示如何將簡單的文本提示轉換為精緻、可發布的數據資產，全程無需經歷手動編碼的繁瑣過程。
ECharts 的三階段工作流程
第一階段：使用 AI 聊天機器人即時構思
旅程從對話式設計開始，讓您可以專注於「要做什麼」，而不是「怎麼做」。
- 提示 AI： 打開 Visual Paradigm AI 聊天機器人介面，並使用自然語言描述您的目標視覺化效果。例如，您可能會輸入：「為區域增長生成每月銷售額長條圖。」
- 初始渲染： AI 會立即解讀您的請求，構建底層的配置邏輯，並在聊天視窗中直接生成圖表的即時視覺預覽。這讓您在繼續推進之前，能夠快速驗證核心概念和數據結構。
圖：顯示提示詞和初始圖表預覽的 AI 聊天機器人介面
第二階段：透過「在 VPasCode 中開啟」無縫轉換
一旦初始概念得到驗證，工作流程就會從對話式 AI 順利過渡到強大的程式碼環境。
- 找到橋樑： 在聊天機器人介面中，尋找位於 AI 渲染的圖表預覽正下方的 「在 VPasCode 中開啟」(Open in VPasCode) 按鈕。
- 轉移上下文： 點擊該按鈕，即可自動將原始的 ECharts 配置和嵌入的數據集直接推送到 VPasCode 工作區。這個關鍵步驟消除了手動複製貼上的需要，確保所有數據參數、座標軸和初始樣式都得到完美保留。
圖：突出顯示「在 VPasCode 中開啟」按鈕和轉換過程
第三階段：深度自訂與匯出
將基礎圖表載入 VPasCode 後，您將獲得對最終設計和分發的完全控制權。
- 並排控制： VPasCode 工作區採用雙窗格介面。您可以使用左側面板的程式碼編輯器來更新數據陣列、修改特定指標或微調樣式細節（例如應用自定義的品牌調色板）。右側的預覽面板會即時更新，讓您可以立即看到程式碼更改所帶來的視覺影響。
- 最終輸出： 一旦您的圖表完全定稿並修飾完畢，您就可以匯出該互動式視覺化作品。您可以選擇將其匯出為高解析度圖像資產以供靜態文件使用，或生成即時、可分享的 URL 以供動態網頁檢視。
圖：將原始圖像從 AI 聊天機器人插入到 VPasCode 並排編輯器和預覽介面
工作流程的關鍵優勢
採用這種整合的 Visual Paradigm 工作流程，為數據分析師、開發者和商業專業人士帶來了幾個顯著的優勢：
- 零摩擦交接： 從對話式構思過渡到技術程式碼只需單擊一下。這種無縫交接保留了所有數據參數，並消除了上下文切換帶來的疲勞感。
- 細緻的精準控制： 您既能受益於生成式 AI 的快速原型設計速度，又能保留完整的程式碼級別控制權。這確保您可以滿足確切的設計規範和品牌指南，而不會犧牲任何功能性。
- 靈活的分發方式： 該工作流程支援多樣化的輸出需求。您可以輕鬆匯出靜態、高品質的圖像資產用於 PDF 報告和簡報投影片，或分享動態即時網頁連結以供利益相關者進行互動檢視。
結論
Visual Paradigm 整合的 ECharts 工作流程，從根本上簡化了數據視覺化的過程。透過結合 AI 聊天機器人的直觀能力與 VPasCode 的精確性，它消除了創建複雜 Apache ECharts 的傳統障礙。無論您是希望加快工作流程的開發者，還是需要創建精確、符合品牌規範圖表的業務分析師，這個三階段流程都能確保您從一個簡單的點子，到最終精緻的資產之間，實現零摩擦的轉換。擁抱這種工作流程，徹底改變您構建、自訂和分享數據故事的方式。
參考資料
- AI Chatbot for Visual Modeling：使用自然語言提示生成圖表與圖形。
- VPasCode: Visual Paradigm as Code：使用基於程式碼的方法來管理和自訂 Visual Paradigm 資產。