Typora上使用Mermaid语法展示流程图、时序图、甘特图

最新推荐文章于 2025-04-30 14:00:50 发布

Kingsaj

最新推荐文章于 2025-04-30 14:00:50 发布

阅读量2.1k

点赞数

分类专栏：项目实操文章标签：流程图甘特图服务器

本文链接：https://blog.youkuaiyun.com/weixin_44412840/article/details/132507911

版权

项目实操专栏收录该内容

199 篇文章 ¥99.90 ¥299.90

订阅专栏

超级会员免费看

本教程指导如何在Typora编辑器中利用Mermaid语法创建流程图、时序图和甘特图。通过graph LR定义流程图节点关系，sequenceDiagram设置时序图的参与者和消息传递，以及gantt定义甘特图的工作段落和任务详情。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

你已经安装Typora并打开了一个新文档后，可以按照以下详细步骤在Typora上使用Mermaid语法展示流程图、时序图、甘特图

流程图

使用graph LR声明开始，并使用箭头和连接符号定义节点之间的关系。
例如，A --> B表示从节点A指向节点B的箭头连接。

graph TB  
  A[界面布局图] --> B[页签区域]  
  B --> C[巡检计划]  
  B --> D[巡检任务]  
  B --> E[巡检路线]  
  B --> F[巡检日志] 
  B --> I[时间选择器]  
  B --> J[查看计划按钮]  
  B --> K[列表]  
  
  K --> L[新增任务按钮]  
  K --> M[地图组件]  
  K --> W[巡检记录] `

效果：
在这里插入图片描述