• 更新（2021-03-12）

  样式有冲突，取消了全局引用，不过可以单篇引用 JS 文件来实现导图支持。

  <script defer src="https://cdn.jsdelivr.net/npm/markmap-autoloader@0.1.2/dist/index.min.js"></script>
  

支持思维导图 Mindmap

使用的是一个 JavaScript 库 Markmap，可以使用 Markdown 语法生成简单的导图，不过样式可能和站点的 CSS 有冲突需要注意一下。

定义样式

可以手动定义画布尺寸和样式。

<style>
.markmap > svg {
    width: 100%;
    height: 350px;
    border: 1px solid black;
}
</style>

语法

使用一个添加了 class="markdown" 的 HTML 元素包裹 Markdown 列表，不要留空行，不然可能渲染不正确。

<div class="markmap">
- Markmap
    - 好看
    - 易用
        - 使用 Markdown 语法
    - 好用
        - 可以内嵌 `Markdown`
        - **加粗** *斜体*
        - [超链接](http://www.telihai.com/archives/9355/)
        - 内嵌[数学公式](http://www.telihai.com/archives/9089/): $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$
    - 交互的
        - 可缩放
        - 可拖拽
        - 点击节点可折叠隐藏
</div>

效果