TEXT TO DIAGRAM

三种语言，无限种表达

写下关系，
看见结构。

把脑海中的流程、架构与协作，变成一目了然的图形。几行文字，即刻成图。

开始绘图阅读文档

在你的浏览器里完成

源码不上传，无需远程渲染服务。

idea.mmdMermaid

01 / 源码PLAIN TEXT

01flowchart LR

02 A[一个想法] --> B[描述关系]

03 B --> C{选择表达}

04 C --> D[清晰的图形]

05 C --> E[继续完善]

06 E --> B

03 / 图形SVG / PNG

正在本地渲染…

MermaidPlantUMLGraphviz

正在本地渲染…

移动指针探索 · 切换图层视角轻点按钮，探索图层

03绘图语言

Mermaid · PlantUML · DOT

25常用模板

从流程到系统架构

SVG / PNG随时导出

用于文档、演示和分享

MIT公共包许可

独立使用，灵活集成

ONE WORKSPACE. THREE LANGUAGES.

不同的想法，都有合适的表达。

使用熟悉的语法，从一个清晰的起点开始。你的源码始终可以继续编辑。

0110 个模板

流程与思考

Mermaid

流程图、时序图、思维导图与更多。让日常的想法快速成形。

0211 个模板

系统与协作

PlantUML

用例、类、组件与部署。把复杂系统的关系讲清楚。

034 个模板

节点与关系

Graphviz

有向图、依赖与分组结构。让连接自然找到自己的位置。

浏览全部模板了解各引擎的支持范围

your-app.vueVUE

<script setup>
import { TextDiagramEditor }
  from '@quirekit/text-diagram-editor/vue'
</script>

<template>
  <TextDiagramEditor
    :request="request"
    :title-editable="true"
  />
</template>

熟悉的源码，完整的控制权。完整接入示例 ↗

ClassicBlockMSFEONE WORKSPACE

MADE TO FIT YOUR APP

一个工作台，融入你的每个场景。

把精力留给自己的产品。源码编辑、图形预览和导出，已经准备好。

打开即用

在已有页面里打开独立弹窗，编辑完成后回到原处。

嵌入你的界面

使用 Vue 工作台，接入自己的主题、数据与保存流程。

只取你需要的能力

从源码直接生成 SVG / PNG，也能独立使用无 UI 的模型。

LET IT TAKE SHAPE.

下一张图，从一行文字开始。

挑一个模板，把你的想法放进去。

开始绘图

写下关系，看见结构。

不同的想法， 都有合适的表达。