前言

相信很多程序员朋友都有在用 Markdown 吧,我是大三找实习工作的时候接触到的,简历就是用 Markdown 写的。

Markdown 的好处是专注码字的同时还能兼顾排版,不用像 word 那样文本加个粗都需要移动下鼠标,体验非常好。

它的缺点就是可视化能力很弱,这就降低了信息的传播效率,毕竟人对于图像化内容的接收程度要强于文本。

可视化表达方面,思维导图就很不错。它作为一种图象化工具,通过层级式发散式地组织主题,帮助我们更好的记忆、学习和思考。

但在过去,这两类工具是各自独立的,也就是你写完 Markdown 文本,想要可视化地传达一些重点给读者,就需要重新录入下思维导图,因此比较繁琐,这也是我不怎么用思维导图的原因。

不过最近我发现一款很好用的工具,可以很好的解决上边的问题,在此分享给大家。以下是本文的重点内容对应的思维导图,就是用这款工具生成的。

工具介绍

这款工具叫 markmap

markmap 可以将 Markdown 语法的文本通过思维导图的方式进行可视化。以下是官网截图,markmap 这个名字来自 markdown 的前半部分 和 mindmap 的后半部分,slogan 是 Visualize your Markdown with mindmaps 。

工具使用

在线版

如果你不想安装任何东西,那可以直接浏览器(建议 chrome 浏览器)上访问 https://markmap.js.org/repl 即可仿照官网模板进行转换,如下图。左边录入 Markdown 文本,右边会实时展示出思维导图。

Markdown 语法中的链接,加粗,删除线,斜体,单行代码,代码块,数学公式,转换成思维导图都有相应的视图效果。而且支持下载生成动态化的 html 文件以及 svg 文件。

动态化效果如下图,可以折叠和打开。

离线版

如果你想拥有更好的使用体验,并且希望在断网的情况下也能够使用,那我推荐你下面这种方案。

在 Visual Studio Code 上安装 markmap 插件,如下图。

编辑 Markdown 文本,文件名以 .mm.md 结尾即可使用,并且可以点击右下角「export」按钮导出动态的 html 文件。

这款工具简单又好用吧,如果对你有用的话,可以给我点个赞,分享给身边朋友,非常感谢读者朋友,也欢迎关注我,我会分享更多优质原创内容


最佳的思维导图生成工具——markmap 使用教程的更多相关文章

  1. 思维导图软件MindManager新手入门教程

    MindManager是一款创造.管理和交流思想的思维导图软件,其直观清晰的可视化界面和强大的功能可以快速捕捉.组织和共享思维.想法.资源和项目进程等等.MindManager新手入门教程专为新手用户 ...

  2. 在线思维导图Ayoa共享功能使用教程

    Ayoa是一个制作思维导图的软件,除了导图制作,小编在使用过程中还发现了一些令人惊喜的功能,这些功能使得Ayoa有了更大的亮点以吸引用户. 下面就为大家简单介绍几个小编认为Ayoa中较为实用的共享功能 ...

  3. 【xmind】 使用 Java 生成思维导图

    前言 在日常的工作与学习中,我们经常会使用思维导图这个工具,来把抽象而又无形的思考转换成有形并且具体的图像,是理清思路,梳理逻辑的一大神器. 准确的说,思维导图并不是一个具体的工具,而是一种方法.是道 ...

  4. 思维导图分享以及MindManager使用说明

    来源于: http://www.cnblogs.com/muhongxing/archive/2009/12/22/1628782.html http://www.cnblogs.com/muhong ...

  5. 用过MindManager后才知道思维导图原来这么简单

    哈喽大家好!时间过得真是太快了,一眨眼这一年就接近尾声了,相信我们都度过了不平凡但十分充足的一年,不知道大家在2020年中有没有令自己满意的收获呢? 相信大家各自都有精彩的收获,我们不妨把它们总结一下 ...

  6. 如何使用MindManager更改思维导图布局

    思维导图可以帮您直观地捕捉想法和信息,并将其组织起来,进一步创建行动计划,思维导图软件MindManager不仅可以帮您分析问题.使用头脑风暴得出解决方案,还可以规划复杂的项目.下面是MindMana ...

  7. 一篇文章一张思维导图看懂Android学习最佳路线

    一篇文章一张思维导图看懂Android学习最佳路线 先上一张android开发知识点学习路线图思维导图 Android学习路线从4个阶段来对Android的学习过程做一个全面的分析:Android初级 ...

  8. JavaScript如何生成思维导图(mindmap)

    JavaScript如何生成思维导图(mindmap) 一.总结 一句话总结:可以直接用gojs gojs 二.一个用JavaScript生成思维导图(mindmap)的github repo(转) ...

  9. 一个用JavaScript生成思维导图(mindmap)的github repo

    github 地址:https://github.com/dundalek/markmap 作者的readme写得很简单. 今天有同事问作者提供的例子到底怎么跑.这里我就写一个更详细的步骤出来. 首先 ...

随机推荐

  1. 我们为什么选择VUE来构建前端

    很多使用过VUE的程序员,对VUE的评价是"Vue.js 兼具angular.js和react.js的优点,并剔除了它们的缺点". 那么,他真的值得这么高的评价嘛? Vue.js的 ...

  2. 分析《令人心动的offer2》网友们都在吐槽什么?

    综艺,是我们劳累了一天的放松方式,也是我们饭后的谈资.看着自己喜欢的综艺,时光足够美.而<令人心动的offer >,就是一个不错的综艺选择.有人说它让自己更自卑了,而我觉得挺有意思. &l ...

  3. Python进阶——什么是上下文管理器?

    在 Python 开发中,我们经常会使用到 with 语法块,例如在读写文件时,保证文件描述符的正确关闭,避免资源泄露问题. 你有没有思考过, with 背后是如何实现的?我们常常听到的上下文管理器究 ...

  4. 【剑指offer】00 开撸剑指offer

    此篇为刷题链接集合,我会将剑指offer中的每一题单独做一篇随笔,然后将链接加在本篇随笔中. //将用JavaScript解题 剑指offer:https://www.nowcoder.com/ta/ ...

  5. APK 的前世今生:从 Android 源码到 apk 的编译打包流程

    最近想要研究热修复的原理,并自己实现一套简单的热修复框架(音视频的坑刚挖好就又挖另一个坑了2333),已经在看书入门 c++,方便后续查看业内一些知名热修复框架的源码,另外在涉及编译期/运行时修改代码 ...

  6. 看起来很唬人,然而却简单实用的CAP理论

    在做分布式系统开发时,经常会或多或少的听到CAP理论.或者是处理节点间数据一致性的问题.CAP理论很简单,但却是很多软件设计的宏观指导,因此也有人将之称为架构师必须掌握的理论之一.鉴于理论的东西相对来 ...

  7. JavaScript 获取数组对象中某一值封装为数组

    1.获取数组对象中某一值封装为数组(一) data = [["2000-06-05",116],["2000-06-06",129]]; var dateLis ...

  8. VC维相关知识

    假设空间H(Hypothesis Set) 输入空间D(X1...Xn) 1.增长函数(grown function) 是关于输入空间尺寸n的函数 假设空间对于D中所有实例实现分类(赋予标记)的分类方 ...

  9. Hadoop3.2.0+Centos7三节点完全分布式安装配置

    一.环境准备 ①准备三台虚拟机,配置静态IP ②先修改主机名(每个节点统一命名规范) vim /etc/hostname master #重启生效 配置DNS每个节点 vim /etc/hosts 1 ...

  10. java中网络通信 Scoket

    在客户/服务器通信模式中,客户端需要主动建立与服务器连接的Socket,服务器端收到客户端的连接请求,也会创建与客户端连接的Socket.Socket可以看做是通信连接两端的收发器,客户端和服务店都通 ...