vue绘制思维导图

前言

在做web的思维导图功能时,搜索了一些开源项目,在这里整理记录一下

正文

vue-power-tree

vue3
github: https://github.com/yj-liuzepeng/vue-power-tree
star:9

介绍

本插件在element-plus树形组件基础上,进行了二次封装。适用于vue3项目,在具备了element-plus 的Tree组件的所有功能的基础上,又增加了组织树展示效果,并同时支持拖拽,及自定义组织树的展开收起样式

vue绘制思维导图_第1张图片

bi-vue-mindmap

vue2
npm: https://www.npmjs.com/package/bi-vue-mindmap

介绍

一个思维导图库,代码没有开源,只找到了npm库地址,功能挺全,很多参数都支持自定义。节点内容也支持自定义

vue绘制思维导图_第2张图片

vue绘制思维导图_第3张图片

vue3-mindmap

vue3
github: https://github.com/hellowuxin/vue3-mindmap
star:324

介绍

vue绘制思维导图_第4张图片

vue绘制思维导图_第5张图片

hyy-vue3-mindMap

vue3
github: https://github.com/huangyuanyin/hyy-vue3-mindMap
star:21

介绍

一个基于Vue3.2 + ElementPlus的Web思维导图vue绘制思维导图_第6张图片vue绘制思维导图_第7张图片

mind-map

github: https://github.com/wanglin2/mind-map
star:477

介绍

本项目包含两部分:

1.一个js思维导图库,不依赖任何框架,你可以使用它来快速完成Web思维导图产品的开发。

开发文档:https://wanglin2.github.io/mind-map/#/doc/zh/

2.一个Web思维导图,基于思维导图库、Vue2.x、ElementUI开发,可以操作电脑本地文件,所以你可以直接把它当做一个在线版思维导图应用使用,如果觉得github的响应速度慢,你也可以部署到你的服务器上。

在线地址:https://wanglin2.github.io/mind-map/

vue绘制思维导图_第8张图片

vue-mindmap

vue2
github: https://github.com/anteriovieira/vue-mindmap
star:569

介绍

vue绘制思维导图_第9张图片

后记

SimpleMindMap

一个不依赖框架的js思维导图库

你可能感兴趣的:(vue.js,前端,javascript,ecmascript,前端框架)