使用 Markdown 语法实现和处理时间线的可能性。
在 GitHub 上搜索,发现了一些 Markdown语法解析时间线的开源组件,比如 mdline,其使用如下图所示的语法进行 Markdown 时间线的解析:
最后渲染出来的时间线如下图所示:
在州的先生看来,其语法的变量稍微有点多,而且左右排列的时间线布局在文档结构中稍显突兀,占据了大量的宽度。
时间线的核心块也就两点:
标题行
内容行
至于标题行是输入时间、日期还是其他文字,应该由使用者自由控制。
所以,初步确定好时间线的语法为:
1.# 标题 2.内容 3.====
如何将时间线与正常的 Markdown 代码块区分开来呢,采用集成思维导图的方式,通过代码块的三引号+timeline进行标识,也就是如下所示:
timeline 2.# 标题 3.内容 4.==== 5.
同时,由于觅道文档使用了 LayUI 作为前端样式组件,其本身也提供了时间线的样式,所以就直接采用它的时间线样式来作为最终渲染出来的样式。
基于上述设定,我们在 Markdown 的解析脚本里面,进行如下的改动:
最后,我们得到如下图所示的 Markdown 时间线解析:
这样,就完成了在 Markdown 中实现时间线解析的功能。