de_DEen_USes_ESfa_IRfr_FRid_IDjapl_PLpt_PTru_RUvizh_CNzh_TW

VPasCode:全面指南

VPasCode 是一款基于浏览器的编辑器,用于创建图表和可视化结构化文本。您可以使用支持的格式编写或生成代码,在实时预览中查看结果,然后分享或导出该图表。它将多种文本转图表引擎以及代码或数据格式整合在一个工作空间中。

VPasCode:入门指南

VPasCode 入门指南,展示五个步骤:打开编辑器、选择格式、输入代码、查看预览,以及分享或导出图表。

  1. 打开 VPasCode 编辑器。

  2. 选择一种格式,或从内置示例之一开始。

  3. 在编辑器中输入或粘贴您的图表代码。

  4. 查看实时渲染的预览效果,并根据需要调整代码。

  5. 通过链接分享图表,或将其导出以便在其他地方使用。

该编辑器被描述为免费且基于浏览器,因此您无需安装桌面绘图应用程序即可工作。

VPasCode:支持的格式和图表类型

VPasCode 支持多种绘图语言、数据格式和编程语言。

VPasCode 信息图,展示支持的图表类型和格式,包括 PlantUML、Mermaid、Graphviz、D2、数据模式以及编程语言。

  • PlantUML:ArchiMate、C4 模型、序列图、用例图、类图、对象图、活动图、组件图、部署图、状态图和时序图;实体关系图(ERD)、陈氏实体关系图(Chen ERD)、网络布局图和工作分解结构(WBS)。

  • Mermaid:流程图、类图和序列图、实体关系图(ERD)、状态图、思维导图、C4 模型、甘特图、四象限图和需求图、时间线、用户旅程图、Git 图以及看板板。

  • Graphviz:有向图和标准图、流程图、组织结构图、聚类图和数据流图。

  • D2:基本形状、容器、序列图、样式化图表和网络图。

  • 数据和模式:SQL、DBML、JSON、JSON Schema、JSONC、JSON5、JSONL/NDJSON、TOON、YAML、XML、CSV 和 TOML。

  • 代码:Java、TypeScript、Go、Rust、C#、Python、C、C++、PHP、Ruby、Scala、Zig、Kotlin、Swift 和 Elixir。

文章指出,未来更新中可能会添加更多格式。

VPasCode:创建图表

您可以通过以下两种方式开始:

  • 自行编写代码:选择一种支持的格式,并在编辑器中输入其语法。

  • 从示例开始:浏览内置示例以学习某种格式,或调整模板以创建您自己的图表。

在编辑过程中,VPasCode 会实时渲染预览。这使您能够在工作的同时发现布局或语法问题,而无需等到单独的导出步骤。

VPasCode:使用 AI 工具

VPasCode 的 AI 功能可帮助创建和完善图表代码:

VPasCode AI 工具信息图,展示四项功能:从文本生成图表、修改现有图表、修复代码错误以及翻译标签。

  • 生成图表:用简单的英语描述一个系统或流程,AI 将为所选格式生成代码。

  • 修改图表:发出指令以扩展、简化或以其他方式调整现有图表。

  • 修复代码错误:使用 AI 辅助功能检测并纠正图表语法问题。

  • 翻译标签:请求翻译功能将图表中的文本标签转换为另一种语言。

这些工具旨在减少手动编写语法的工作。在分享之前,请审查生成的或修改后的代码并预览结果。

VPasCode:PlantUML 主题

对于 PlantUML 图表,编辑器提供主题选择界面。从可用列表中选择主题以应用其语法并预览更新后的外观。本文还介绍了自定义的 Visual Paradigm 和 Rose 主题:前者使用蓝色标题,后者采用经典的浅黄色 IBM Rational Rose 风格。

VPasCode:共享与导出

当您的图表准备就绪后,您可以:

  • 创建一个可共享的网页链接。

  • 将其导出为矢量 PDF。

  • 将其导出为 SVG 矢量图像。

  • 将其导出为高分辨率 PNG。

矢量格式(如 SVG 和 PDF)在需要缩放图表而不损失清晰度时非常有用;PNG 则适用于常见文档和演示文稿。

VPasCode:连接 AI 服务提供商

图表展示 VPasCode 如何利用现有的 API 凭据,将组织的 AI 基础设施连接到 OpenAI 和 Anthropic 等提供商。

组织可以连接自己的 AI 基础设施并使用现有的 API 凭据。本文列出了 OpenAI、Anthropic、Google、DeepSeek、Mistral、Qwen 和 Groq 等提供商。此选项旨在让您对 AI 环境、凭据和费用安排进行控制;请根据您的组织需求进行配置。

VPasCode:实用工作流程

七步 VPasCode 工作流程图,展示格式选择、AI 生成、代码编辑、预览、主题设置以及导出选项。

  1. 选择适合您使用场景的图表格式。

  2. 从内置示例开始,或向 AI 生成器描述图表。

  3. 检查并编辑生成的代码。

  4. 使用实时预览检查可读性和正确性。

  5. 如果您正在使用 PlantUML,请应用主题。

  6. 如有需要,可使用 AI 修改、错误纠正或翻译功能。

  7. 分享链接或导出完成的图表。

当您更倾向于基于文本的图表编辑、需要在多种图表格式之间工作,或希望快速生成和修订图表而无需手动排列每个形状时,VPasCode 最为实用。