)
思源笔记 Mermaid 甘特图3 步画出能带上会议的项目排期实操指南【免费下载链接】siyuanAn open-source, privacy-first, self-hosted knowledge workspace where humans and AI agents work together 开源、隐私优先、自托管的知识工作空间让人与智能体在此协作项目地址: https://gitcode.com/GitHub_Trending/si/siyuan周会上被问“v2.0 进度到哪了”你只能边翻项目表边口头描述对方听得迷糊贴一张时间线截图吧图糊日期一改又得重画。SiYuan思源笔记开源、隐私优先、自托管的知识工作空间让你用几行 Mermaid 甘特图文本就能在笔记里实时渲染出项目排期图不装插件、不写代码。本文带你用 6 行文字画出一张排期十分钟就能上手。为什么选 Mermaid 画排期文字即排期改起来不心疼。每个任务就是一行文字改开始日期、加一个任务编辑一行字图立刻跟着变。排期从此不是扔完就扔的图而是可版本管理的笔记手滑删了还能靠数据历史找回来。渲染由内核兜底。SiYuan 内置 Mermaid 11.x 引擎针对甘特图在渲染配置里单独设置了左右留白leftPadding: 75、rightPadding: 20日期列和任务条不会打架深色模式下图表自动切深色配色逻辑见 mermaidRender.ts。图和知识库在同一张平面上。甘特图就是一个普通内容块能像其他块一样被引用、被反向链接、被搜索。排期放进周报笔记里程碑一改处处生效。不存在锁定。图源就是纯文本拷到任何支持 Mermaid 的环境都能直接渲染。最小可运行示例三步插入第一张甘特图第 1 步用 / 菜单触发 Mermaid 块编辑器空白行敲/命令菜单弹出后输入mermaid或「图表」回车即可插入 Mermaid 代码块也可以直接手写三个反引号加mermaid回车效果一样。菜单选项在 extend.ts 里维护Mermaid 项的筛选词里就有tubiao。第 2 步写入 6 行最小甘特图把下面这段贴进代码块dateFormat声明日期格式section给任务分列之后每行都是「任务名 : 任务id, 开始日期, 时长」第 3 步停手一拍看渲染不渲染才叫意外——停手一拍页面自动画出「接口联调」「自测」两条横条按日期轴排布「自测」紧跟在联调结束处after a1替你算好了日期。切到阅读模式是干净的 SVG 矢量图切深色模式配色自动跟随核心规则一句话「排期在笔记里图只是它的快照」——每行甘特图都是「任务名 : id, 日期, 时长」写日期就能出条用after串顺序。从最小示例到真实项目排期掌握最小写法后还有两个进阶语法值得知道给关键路径加标记。在任务 id 前写crit这条横条会被高亮。评审会上问哪个环节最容易拖期指着粗的那条说就行。关键节点用里程碑。milestone画的是菱形标记而不是长条适合「发版日」「验收日」这种一天内完成的事。下面是一份完整的 v2.0 发版排期三个 phase 分列、依赖全靠after、关键路径和发版节点一并标出这张图的组织思路是「图的结构就是项目的结构」先想清楚分几个 phasesection再在列内和列间用after把顺序串起来——画图的过程其实是把项目重新想了一遍。常见问题排查甘特图不渲染怎么办为什么整张图不渲染Mermaid 对语法非常直率日期必须是YYYY-MM-DD任务名后面的冒号必须半角逗号后要空一格。报错时图不渲染、只显示红色错误信息按提示定位到行去改别盲目删。为什么任务名或日期列被截断内核已经给甘特图配了左右留白但甘特图没有自动换行中文名太长条上的标签就会被截。把任务名写短一点细节留在笔记正文里。它能替代 Excel 或项目管理工具吗坦率说不能。它画的是「给团队看的可读排期」不能拖条改日期也没有实际进度跟踪。正式基线还是用项目工具管这张图放进周报和交接文档两者不冲突。画完之后有三条出路选中渲染结果复制图像直接贴进周报右键笔记导出 HTML / PDF图表以矢量形式保留导出逻辑见 export 模块或者直接把甘特图文本复制给团队在任何 Mermaid 工具里复用。现在合上这页打开 SiYuan在任意空白笔记里敲/用 6 行文字画出你的第一张项目甘特图。参考资料官方使用文档README.zh-CN.md甘特图渲染实现版本、留白与主题配置app/src/protyle/render/mermaidRender.ts斜杠菜单选项定义app/src/protyle/hint/extend.ts【免费下载链接】siyuanAn open-source, privacy-first, self-hosted knowledge workspace where humans and AI agents work together 开源、隐私优先、自托管的知识工作空间让人与智能体在此协作项目地址: https://gitcode.com/GitHub_Trending/si/siyuan创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考