希望新增mindMap思维导图功能

[oicu]

请按照一下格式提交issue，谢谢！

1. 你当前使用的是哪个版本的 MinDoc(godoc_linux_amd64 version)? v2.0

2. 你当前使用的是什么操作系统? Windows 10 LTSC 2019

3. 你是如何操作的？ 从 https://gitee.com/zmister/MrDoc 移植了 mindMap 功能。

下载 3 个 js 文件：

https://cdn.jsdelivr.net/npm/d3@5

https://cdn.jsdelivr.net/npm/[email protected]/dist/view.js
https://cdn.jsdelivr.net/npm/[email protected]/dist/view.min.js

https://cdn.jsdelivr.net/npm/[email protected]/dist/transform.js
https://cdn.jsdelivr.net/npm/[email protected]/dist/transform.min.js

放到

/mindoc/static/editor.md/lib/mindmap/

然后按照附件diff文件 editormd.js.zip 修改

/mindoc/static/editor.md/editormd.js

增加自定义思维导图高度： https://github.com/zmister2016/MrDoc/issues/3

修改以下文件在 editormd.js 之前调用 3 个 js：

/mindoc/views/manager/config.tpl
/mindoc/views/blog/manage_edit.tpl
/mindoc/views/document/markdown_edit_template.tpl

4. 你期望得到什么结果? 支持思维导图。

5. 当前遇到的是什么结果? 个人水平有限，思维导图只能编辑状态能【展开/收起】节点，文档发布后，思维导图变成静态的。

[3xxx]

试了一下，确实可以了，感谢。也支持大小了。发布后怎么可以展开收起呢？大佬继续加油。

// else if (/^mindmap/i.test(lang)){
            // 　　var len = 9 || 32;
            // 　　var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
            // 　　var maxPos = $chars.length;
            // 　　var map_id = '';
            // 　　for (var i = 0; i < len; i++) {
            // 　　　　map_id += $chars.charAt(Math.floor(Math.random() * maxPos));
            //     }
                // var map_id = lang.split('>')[1];
                // console.log(map_id)
                // return "<svg class='mindmap' style='width:100%;min-height=150px;' id='mindmap-"+ map_id +"'>"+code+"</svg>";

            else if (/^mindmap/i.test(lang)){ // 思维导图
            　　var len = 9 || 32;
            　　var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; 
            　　var maxPos = $chars.length;
            　　var map_id = '';
            　　for (var i = 0; i < len; i++) {
            　　　　map_id += $chars.charAt(Math.floor(Math.random() * maxPos));
                }
                // var map_id = lang.split('>')[1];
                // console.log(map_id)
                var custom_height;
                var h = lang.split('>')[1];
                if(h != undefined){
                    custom_height = h;
                }else{
                    custom_height = 150;
                }

                return "<svg class='mindmap' style='width:100%;min-height:150px;height:"+ custom_height +"px;' id='mindmap-"+ map_id +"'>"+code+"</svg>";
            }

[3xxx]

本身它就支持mermaid各种思维导图

graph TD
      B["fa:fa-twitter for peace"]
      B-->C[fa:fa-ban forbidden]
      B-->D(fa:fa-spinner);
      B-->E(A fa:fa-camera-retro perhaps?);

[3xxx]

我感觉无法实现。 因为，我觉得，mindmap之所以能够支持展开和收缩，因为它“必须”是通过数据 实时 生成的思维导图。而mindoc是将数据生成思维导图后的样式数据存入数据库，展示的时候直接展示出思维导图，所以无法支持收缩、展开了。我觉得本质应该是id之类的来控制的。如下，每次生成的class="mm-x9xvnh-1-fo"都不一样。 <foreignObject class="mm-x9xvnh-1-fo" x="8" y="0" height="20" width="49" style="opacity: 1;"><div xmlns="http://www.w3.org/1999/xhtml">foobar</div></foreignObject>