Web思维导图库SimpleMindMap使用详解

废话不多说先附上官网：SimpleMindMap

Git仓库地址：https://github.com/wanglin2/mind-map

在线体验使用地址：思绪思维导图

友好性：

除了PC端另外还提​​供了客户端手动下载使用，支持Windows、Mac及Linux。

特性：

• 插件化架构，除核心功能外，其他功能作为插件提供，后续使用，减少压缩体积
• 支持逻辑结构图（向左、向右逻辑结构图）、思维导图、组织结构图、目录组织图、时间轴（横向、竖向）、鱼骨图等结构
• 内置多种主题，允许高度自定义风格，支持注册新主题
• 节点内容支持文本（普通文本、富文本）、图片、图标、超链接、备注、标签、概要、数学公式
• 节点支持拖拽（拖拽移动、自由调整）、多种节点形状；支持扩展节点内容、支持使用DDM 完全节点节点内容
• 报纸拖动、
• 支持鼠标键盘选择和Ctrl+左键两种多选节点方式
• 支持导出为json、png、svg、pdf、markdown、xmind、txt，支持从json、xmind、markdown导入
• 支持快捷键、前进后退、关联线、搜索替换、小地图、水印、滚动条、交互风格、彩虹线条、标记、外框
• 提供丰富的配置，满足各种场景使用习惯
• 帮助编辑

本项目未实现的功能特点：

• 不支持自由节点，即多个根节点；
• 概要节点后面不可继续添加节点。

使用：

我是直接本地化部署github库进行部署使用的，个人觉得官方库功能全使用场景可全面覆盖。

这是在线使用的页面：

这是我基于源码修改后的页面：

数据使用localStorage本地存储：在源码中可以很清楚的找到其存储逻辑，将其替换为自己数据接口的数据，源码中代码注释很清晰，可以很清楚的找到相关的逻辑。

总结：

思维导图这块没有你想的那么乃求，找到成熟合理的插件不要再犹豫不要再等待，动手一试便知，祝大家早日上岸，该文章内容对你有帮助的话可以给后生点个赞，谢谢。