思源文档树 or 大纲以思维导图方式显示技巧

前言

最近在思源社区看到有这样的需求--文档树 or 大纲以脑图形式展示出来，当时并没有什么思路，直到今天我脑海里突然冒出一个想法，那就是通过【目录插件】配合【自定义块样式】插件实现类似的效果，废话不多说，直接展示视频效果

视频效果

制作过程

首先安装【目录插件】配合【自定义块样式】这两个插件

文档树思维导图制作

1. 这是实验文档

   1. 

2. 在主节点文档中，按下Ctrl+Shift+I快捷键

   1. 

3. 再用【自定义块样式】插件转换为思维导图即可

   1. 
   2. 
   3. 想要将其悬浮显示达到快速点击效果可以看这篇文章，分享思源笔记的几个骚操作 - 链滴

大纲思维导图制作

1. 在对应文档处按下Ctrl+Shift+P快捷键

   1. 

2. 再通过【自定义块样式】插件转换为导图模式即可

   1. 
   2. 
   3. 代码片段文章推荐：[css] [js] 思源代码片段插件分享- 链滴

‍