VPasCode 是一个基于浏览器的工作区，用于从基于文本的代码创建和查看图表。它支持包括 PlantUML、Mermaid、Graphviz 和 D2 在内的多种图表语言，并将代码编辑、实时渲染和 AI 辅助工具整合在一处。您编写或生成图表脚本，VPasCode 会将其渲染为可视化图表。
1. 开始创建图表
-
在您的网页浏览器中打开 VPasCode。
-
从空白编辑器开始，或粘贴现有的图表脚本。
-
对于 PlantUML，请包含通常的
@startuml和@enduml标记。VPasCode 可以检测 PlantUML 语法并激活相应的渲染器。 -
在操作过程中随时检查渲染后的图表。
2. 使用 AI 生成图表
使用 AI 助手将自然语言描述转换为图表代码。请明确说明您希望包含的元素和关系。
例如，您可以这样提问：
创建一个用户登录认证序列图，包括用户、Web 应用、认证服务和数据库。
检查生成的代码及其渲染结果。如果缺少重要的参与者、步骤或关系，请优化提示词。
3. 优化现有代码
无需从头开始，使用自然语言指令修改您已有的图表。描述您希望进行的更改及其位置。
例如：
在订单提交步骤后立即添加支付网关检查。
然后检查更新后的代码和图表，确保更改符合预期的工作流程。
4. 修复错误
如果图表未按预期渲染，请使用 AI 代码错误修复工具来诊断和修复语法问题。该工具可以识别拼写错误、缺失括号或标记未对齐等问题，进行修正并解释出错原因。
应用修复后，请检查代码和渲染后的图表，以确认结果正确。
5. 翻译图表文本
使用 AI 图表翻译工具翻译图表内的文本，例如标签、类属性和消息描述。这有助于为国际团队准备图表。
在上下文中审查翻译后的术语，特别是应保持不变的 technical 词汇和名称。
6. 应用主题
在编辑器中选择主题以调整图表的视觉风格。可用选项包括 Visual Paradigm 的经典主题及其他经典替代方案。主题设置可自动为您应用合适的皮肤参数。
导出前请检查结果的可读性和一致性。
7. 导出与分享
选择适合图表使用方式的导出格式：
| 格式 | 适用场景 |
|---|---|
| SVG | 可扩展的 Web 文档和技术维基 |
| PNG | 聊天应用、缺陷跟踪器和演示文稿 |
| 正式文档和打印 |
要分享图表，请使用平台生成的直接 URL 或二维码。
实用工作流程
-
描述您希望建模的系统、流程或架构。
-
使用 AI 生成初始图表代码，或粘贴现有脚本。
-
查看实时渲染效果，并通过针对性指令优化图表。
-
如果语法问题导致无法渲染，请使用错误修复功能。
-
如有需要，可翻译标签或应用主题。
-
以适合您文档或演示的格式导出。
-
使用图表的 URL 或二维码进行分享。
