vnote icon indicating copy to clipboard operation
vnote copied to clipboard

建议增加MarkMap预览思维导图的功能

Open Roseleaves opened this issue 3 years ago • 3 comments

Is your feature request related to a problem? Please describe. Markdown的列表和子标题等功能十分强大,它和思维导图的匹配性非常的好。

Describe the solution you'd like 在非编辑状态(预览状态),可以选择是否开启markmap模式; 在大纲的下拉列表和左边栏,可以选择是否以markmap模式展示

Describe alternatives you've considered 可以双开vscode和vnote,但我并不想。

Additional context 事实上,基于markmap.js的阅读器,就连保持追着一个md文件的最新状态并不断更新思维导图的,都没有

Roseleaves avatar Nov 08 '21 12:11 Roseleaves

这种吗? image vnote支持“plantuml”而“plantuml”支持思维导图

使用方法

  1. 引入plantuml-1.2022.2.jar,放置在任意位置(建议在vnote根目录下创建一个名为“lib”的文件夹,将这个jar放置在里面)
  2. 在vnote里面引入上述jar文件,如下图 image
  3. 然后就可以写了(注意,这个语法不支持四个空格的缩进,只能支持一个空格(对,没写错,就是一个空格)或者table缩进),下面是示例代码(需要放置到代码类型为“puml”的代码块里,```puml)
@startmindmap
* root node
	* some first level node
		* second level node
		* another second level node
	* another first level node
@endmindmap

Fxiao1 avatar May 24 '22 03:05 Fxiao1

这种吗? image vnote支持“plantuml”而“plantuml”支持思维导图

使用方法

  1. 引入plantuml-1.2022.2.jar,放置在任意位置(建议在vnote根目录下创建一个名为“lib”的文件夹,将这个jar放置在里面)
  2. 在vnote里面引入上述jar文件,如下图 image
  3. 然后就可以写了(注意,这个语法不支持四个空格的缩进,只能支持一个空格(对,没写错,就是一个空格)或者table缩进),下面是示例代码(需要放置到代码类型为“puml”的代码块里,```puml)
@startmindmap
* root node
	* some first level node
		* second level node
		* another second level node
	* another first level node
@endmindmap
  1. planuml提供的的思维导图功能太僵化,当节点多时怎么办,无法进行折叠收纳;yn这个markdown编辑器提供了体验效果比较好的思维导图功能,所以希望vnote也能提供类似的功能 参考

WuQuDeRen avatar May 29 '22 01:05 WuQuDeRen

Is your feature request related to a problem? Please describe. Markdown的列表和子标题等功能十分强大,它和思维导图的匹配性非常的好。

Describe the solution you'd like 在非编辑状态(预览状态),可以选择是否开启markmap模式; 在大纲的下拉列表和左边栏,可以选择是否以markmap模式展示

Describe alternatives you've considered 可以双开vscode和vnote,但我并不想。

Additional context 事实上,基于markmap.js的阅读器,就连保持追着一个md文件的最新状态并不断更新思维导图的,都没有

有个疑问对于第一点,markdown的标题只有6级,思维导图编写的时候,很可能超过6级,那超过6级咋办?

WuQuDeRen avatar May 29 '22 01:05 WuQuDeRen

markmap已经有具体实现(无需考虑标题超过6级问题,列表没有6级限制呀) https://markmap.js.org/repl

我想到有3种方案: 方案1: 使用正常笔记后缀.md,编辑、阅读模式保持不变,右键菜单增加markmap选项。 image

方案2: 使用正常笔记后缀.md,根据metadata信息自动识别,修改阅读模式展示方式。 image

方案3: 使用特定后缀,.mm.md

ygcaicn avatar Jan 17 '23 10:01 ygcaicn

markmap已经有具体实现(无需考虑标题超过6级问题,列表没有6级限制呀) https://markmap.js.org/repl

我想到有3种方案: 方案1: 使用正常笔记后缀.md,编辑、阅读模式保持不变,右键菜单增加markmap选项。 image

方案2: 使用正常笔记后缀.md,根据metadata信息自动识别,修改阅读模式展示方式。 image

方案3: 使用特定后缀,.mm.md

使用markmap的话,渲染用的是marked?这样我担心会不太统一。其实我的想法是自己根据md-it渲染后的效果,提取标题和列表,然后组合成exlir-mind的数据结构,展示出来。或者使用markmap但使用我们渲染后的元素进行渲染。你觉得呢?

现在有一个查看模式,编辑模式的查看模式是原地预览和双边预览。我觉得可以添加一个查看模式到阅读模式?当然可以通过元数据来选择默认的查看模式。

tamlok avatar Jan 17 '23 13:01 tamlok

@tamlok 大致看了一下markmap的逻辑如下:

Basically we use markmap-lib to preprocess Markdown into structured data, then render the data into interactive SVG with markmap-view.

新增一个查看模式到阅读模式我觉得很好,这样侵入性很小,还能获得很好的体验。

ygcaicn avatar Jan 17 '23 14:01 ygcaicn