Markmap combines markdown and mindmap

本文演示通过markmap 的 auto-loader 直接加载方式，在网页中展示思维导图mindmap。 前期准备工作是在 pelican 主题的模板html文件中加入 style 和 markmap-autoloader 脚本， 然后在 markdown 文本中加入 class="markmap" 的 div 即可，内容按markdown 格式。

<div class="markmap">
    <script type="text/template">

---
  markmap:
    maxWidth: 500
  colorFreezeLevel: 2
---

# Title

## Head

    </script>
</div>

展示效果如下，可以通过下方的 toolbar 进行缩放调整。

参考链接：

https://markmap.js.org/docs/markmap

https://stackblitz.com/edit/markmap-autoloader?file=index.html