去年过年整理了一次p4f的技术栈，最近受StuQ和leohxj的启发又开始整理适合我司的各个研发职位的技能图谱：这类树状的图片其实就是脑图(Mindmap)。

图片形式的文档都有一个麻烦的地方，就是不太好做版本控制和 review。比如如果本座来整理 Web 前端技能图谱，总希望：

• 能够发给前端组的人 review
• 能够放到代码库，让前端组维护起来，根据业界动态不断更新

如果是张图片，弄起来就比较麻烦，这个时候就需要 Markdown 出场了。其实最近这几年，用 Markdown 写文档大概也算 Best Practice 的一个了。好处确实很多，最重要的两个：

• 集成到现有的开发流程里面把文档也交叉 review、版本化、自动部署
• 有个三长两短的时候，迁移成本非常低

只不过从 Markdown 生成脑图还是比较偏门，所以分享一下。

其实大多数的脑图软件（ 比如 MindNode 或者 Mindjet MindManager）都支持把缩进好的文本直接导入生成图片。以我在用的 MindNode 为例，你可以把下面的格式：

- 研发团队
	- 前端组
	- 后端组
	- 运维组
	- 测试组
	- 平台组
		- 数据组
		- RIO组

这样贴到 MindNode 里面，就会生成下面的脑图：

但是上面的格式，如果是以 Markdown 的格式放到代码库里面，有略显难看。所以更进一步，你可以先用 Markdown 的#来标不同层级，使得文档本身可以在网页上显示成规则的列表，类似这样，它的原始 Markdown 文件在这里。

然后，通过脚本把文档里面的#转换成\t，就可以得到能够直接粘贴到 MindNode 里面生成脑图的文本了。如果你是使用 Mac，还可以直接把转换脚本创建成一个service通过Automator安装，这样你在任何一个 Markdown 文档上选中需要生成脑图的部分，右键就可以了：

还有个未尽事宜就是在转换脚本里面加一个步骤：Markdown 里面的链接，生成图片的时候把方括号、圆括号以及圆括号里面的链接去掉，不然就太难看了：