kityminder-editor + MongoDB 思维导图数据自动实时保存方案

最新推荐文章于 2024-08-09 07:12:00 发布
最新推荐文章于 2024-08-09 07:12:00 发布
阅读量791 收藏 3
点赞数 1
文章标签： 数据库 json 前端 ViewUI
原文链接：http://www.cnblogs.com/star91/p/kitymindereditor--MongoDB-si-wei-dao-tu-shu-ju-zi-.html
版权
本文介绍了如何结合kityminder-editor和MongoDB实现思维导图数据的实时保存。通过JSON-Patch计算内容变化，将diffPatches转化为MongoDB操作符进行更新。在实践中遇到数组元素删除问题，通过过滤null值解决了渲染错误。
摘要由CSDN通过智能技术生成

最近开始做自己的第一个开源项目:一个基于思维导图的测试用例管理系统MinderCase,在做了一周的技术调研后，决定采用kityminder-editor作为思维导图编辑器，为了支持实时存储，当思维导图内容变化时使用JSON-Patch计算出内容变化产生的diffPatches,然后将diffPatches传给后台映射为对应的MongoDB操作符，执行更新操作

JSON-Patch是用来描述JSON数据变化的一种形式。使用它可以避免在JSON数据只发生部分修改时发送整个文档。与HTTP Patch方法是天造地设的一对，它允许以符合标准的方式对HTTP API进行部分更新。
kityminder-editor使用JSON结构来存储数据，每个节点包括一个data字段表示节点本身的属性，children数组包含该节点的子节点，依次递归嵌套。在编辑思维导图的时候，最多的动作就是对节点的增、删、改，对于这种树形结构，借鉴传统关系型数据库的设计思路，可以使用节点引用的存储方法，参考MongoDB树形结构建模，但是在很多情况下，节点的增删查改会会引起大量的数据库操作，因此可以充分发挥MongoDB的优势，把整个JSON数据存储在一个doc

最低0.47元/天 解锁文章
weixin_30414155
关注
MongoDB思维导图，常用命令及安装使用等
06-05
- **数据存储目录创建**：MongoDB默认将数据存储在`db`目录下，但这个目录不会自动创建，安装完成后需手动创建该目录，建议放置于根目录（如：C:\ 或 D:\）。 - **运行MongoDB服务器**：通过命令行运行`C:\mongodb...
kity-minder-editor
04-23
kity-minder-editor本地化改造，是百度的一个开源项目，根据网上教程改造。
KityMinder-Editor
05-29
Kity Minder 简介 KityMinder 是百度 FEX 团队的 f-cube 小组（原 UEditor 小组）的又一力作。作为一款在线的脑图编辑工具，它有着不亚于 native 脑图工具的交互体验。同时，它充分发挥了 Web 云存储的优势，可以直接将编辑中的脑图同步到云端。此外，借由独创的 “云盘分享”功能，用户可以一键将当前编辑的脑图直接生成在线链接共享给其他用户，实现无缝沟通。 KityMinder 基于 SVG 技术实现，支持绝大多数的主流浏览器，包括： Chrome Firefox Safari Internet Explorer 10 或以上 线上版本 产品地址： 依赖说明 KityMinder 依赖 Kity、FIO、FUI 库。需要二次开发 KityMinder，需要先从 Github 上拉代码下来： git clone https://github.com/fe
KityMinder Editor 教程
最新发布
gitblog_00034的博客
08-09 550
KityMinder Editor 教程 kityminder-editorPowerful Mindmap Editing Tool项目地址:https://gitcode.com/gh_mirrors/ki/kityminder-editor 1. 项目介绍 KityMinder Editor 是一个强大的、简洁且用户体验优良的脑图编辑工具，它用于编辑树状、图状及网络结构的数据。这个编辑器由...
KityMinder Editor ========== ## 简介 KityMinder Editor 是一款强大、简洁、体验优秀的脑图编辑工具，适合用于编辑树/图/网等结构的数据。
sunnywei_yiyi的专栏
08-01 2798
KityMinder Editor ========== ## 简介 KityMinder Editor 是一款强大、简洁、体验优秀的脑图编辑工具，适合用于编辑树/图/网等结构的数据。 编辑器由百度 [FEX](https://github.com/fex-team) 基于 [kityminder-core](https://github.com/fex-team/
kityminder-editor:强大的思维导图编辑工具
05-02
KityMinder Editor 简介 KityMinder Editor 是一款强大、简洁、体验优秀的脑图编辑工具，适合用于编辑树/图/网等结构的数据。 编辑器由百度 基于 搭建，并且在中使用。 他们的区别与联系如下： 是 kityminder 的核心部分，基于百度 开发的矢量图形库 。包含了脑图数据的可视化展现，简单编辑功能等所有底层支持。 基于 kityminder-core 搭建，依赖于 AngularJS，包含 UI 和热盒 等方便用户输入的功能，简单来说，就是一款编辑器。 基于 kityminder-editor，加入了第三方格式导入导出 (FreeMind, XMind, MindManager) 、文件储存、用户认证、文件分享、历史版本等业务逻辑。 功能 基本操作：文本编辑，节点折叠、插入、删除、排序、归纳、复制、剪切、粘贴等 样式控制：字体、加粗、斜体、颜
kityminder-editor 百度脑图与my-mind 使用体验
小生测试的博客
08-31 3440
1. kityminder 脑图 安装参考以下文档 https://www.cnblogs.com/pellime/p/9795075.html 操作 2. my-mind 脑图 linux安装： 新建一个文件目录 mymind git clone https://github.com/ondras/my-mind.git 安装apache 服务 yum -y install httpd ...
MongoDB思维导图
12-10
- **复制集**：提供数据冗余和故障转移，由多个节点组成，数据自动同步。 - **分片集群**：用于水平扩展，将数据分散到多个节点上，以处理大量数据和高并发读写。 8. **MongoDB Shell**： - 它是MongoDB的交互式...
Spring-data + MongoDb源码
10-19
在IT领域，Spring Data是一个广泛使用的框架，它简化了与各种数据存储的交互，包括关系型数据库、NoSQL数据库和搜索引擎。MongoDB则是一种流行的NoSQL文档型数据库，以其灵活性、可扩展性和高性能而受到赞誉。Spring...
推荐开源项目：KityMinder Editor —— 强大的脑图编辑神器
gitblog_00028的博客
05-11 461
推荐开源项目：KityMinder Editor —— 强大的脑图编辑神器 kityminder-editorPowerful Mindmap Editing Tool项目地址:https://gitcode.com/gh_mirrors/ki/kityminder-editor 项目介绍 KityMinder Editor 是一款高效、轻巧、用户体验卓越的在线脑图编辑工具，专为编辑树状、图形和...
KityMinder百度脑图一款在线的脑图编辑工具
08-08
KityMinder 是百度FEX团队的f-cube小组（原UEditor小组）的又一力作。作为一款在线的脑图编辑工具，它有着很多Native编辑工具的交互体验。KM与UE有着一样的宗旨，就是注重最终用户的使用体验。
kityminder-js
03-23
类似XMind的js图形插件，自己做了显示位置代码优化。 KityMinder 是一款强大的脑图可视化/编辑工具，由百度 FEX 团队开发并维护。 其中 KityMinder-Core 是它的核心实现部分： 包括脑图数据的可视化展示（Json 格式） 包括简单的编辑功能（节点创建、编辑、删除）。需要丰富编辑功能的请移步 KityMinder 编辑器。 不包含第三方格式（FreeMind、XMind、MindManager、纯文本、Markdown 等）的支持，可以加载 kityminder-protocol 来扩展第三方格式支持。 不包含文件存储的支持，需要自行实现存储。可参照百度脑图中的开源的 fio + 百度网盘方案进行实现。
用ASP.NET二次开发百度脑图KityMinder
12-13
使用开源项目百度脑图开发自己的脑图,实现导入导出,后台采用ASP.net,项目可正常运行.
使用百度脑图kityminder-editor进行数据可视化二次开发
热门推荐
u011468619的博客
04-26 1万+
KityMinder Editor 是一款强大、简洁、体验优秀的脑图编辑工具，适合用于编辑树/图/网等结构的数据。 编辑器由百度 FEX 基于 kityminder-core 搭建，并且在百度脑图中使用。 根目录下的 index.html 为开发环境，dist 目录下的 index.html 使用打包好的代码，适用于线上环境。 1、安装 nodejs 和 npm 2、初始化：切到 ki
探索无限创意：KityMinder Editor，你的思维导图编辑神器
gitblog_01182的博客
08-09 929
探索无限创意：KityMinder Editor，你的思维导图编辑神器 kityminder-editorPowerful Mindmap Editing Tool项目地址:https://gitcode.com/gh_mirrors/ki/kityminder-editor 项目介绍 KityMinder Editor 是一款由百度 FEX 团队匠心打造的高效能、易用性强的在线脑图编辑工具。它...
(十)、kityminder支持富文本的编辑
saii的专栏
02-24 914
前段时间，去试用了下processon 上的脑图功能，发现人家这块确实已经做的好强大了。而且他的节点竟然还可以支持单独某个文本的颜色字体的设置，这个可是连xmind，本身都没有实现的功能的。所以想着学习下人家的实现看看是否能够借鉴到我们的平台上来。
flume数据采集_基于nginx+flume+kafka+mongodb实现埋点数据采集
05-17
在数据采集方面，flume可以很好地与nginx、kafka、mongodb等常见的数据处理工具和数据库进行集成。下面介绍一下基于nginx+flume+kafka+mongodb实现埋点数据采集的步骤： 1. 配置nginx服务器，将所有的http请求都...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值