当前位置: 首页 > news >正文

在vue2使用百度脑图的kityminder-core进行二次开发思维导图,给节点绑定数据后添加新的图标

需求说明:在给某个节点绑定文件数据后,用户并不能一眼看出哪个节点上绑定了数据,因此需要在绑定文件数据后给节点上加一个图标用于标识。

添加图标 

1、在kityminder-core/src/module/file.js文件中添加代码

(file.js文件如何添加的看下面这个如何新增命令的文章)

在vue2使用百度脑图的kityminder-core进行二次开发思维导图,在源码中添加新的命令_~Serendipity~的博客-CSDN博客_vue中使用百度脑图

     添加以下红框中的代码,关于FILE_PATH是文件图标的svg路径,可以到网站上自己设计然后复制路径替换就行。

 一个画SVG图标的网站   SvgPathEditor

部分需要添加的代码 

var FILE_PATH = 'M -3 3 L -3 1 L 3 1 L 5 4 L 10 4 L 10 13 L -3 13 L -3 3 M 8 9 L 4 9'var FileIcon = kity.createClass('FileIcon', {base: kity.Group,constructor: function () {this.callBase();this.width = 16;this.height = 17;this.rect = new kity.Rect(16, 17, 0.5, -8.5, 2).fill('transparent');this.path = new kity.Path().setPathData(FILE_PATH).setTranslate(2.5, -6.5);this.addShapes([this.rect, this.path]);}
});
var FileIconRenderer = kity.createClass('FileIconRenderer', {base: Renderer,create: function (node) {var icon = new FileIcon();return icon;},shouldRender: function (node) {return node.getData('jsonFile');},update: function (icon, node, box) {var x = box.right + node.getStyle('space-left');var y = box.cy;icon.path.fill('none');icon.path.stroke('#111111');icon.setTranslate(x, y);return new kity.Box(x, Math.round(y - icon.height / 2), icon.width, icon.height);}
});

 

2、在dist/kityminder.core.js中找到查找FileCommand ,添加与file.js中一样的代码。

 3、使用uglifyjs重新生成min.js文件。

 

 

相关文章:

在vue2使用百度脑图的kityminder-core进行二次开发思维导图,给节点绑定数据后添加新的图标

需求说明:在给某个节点绑定文件数据后,用户并不能一眼看出哪个节点上绑定了数据,因此需要在绑定文件数据后给节点上加一个图标用于标识。 添加图标 1、在kityminder-core/src/module/file.js文件中添加代码 (file.js文件如何添加…...

FPGA时序约束与分析 --- 时序约束概述

本系列参考文献 — FPGA时序与约束分析-吴厚航 FPGA从综合到实现需要的过程如下:synth_design -> opt_design -> place-design -> phys_opt_design -> route_design 1、时序约束的理解 2、时序约束的基本路径 3、时序约束的步骤 4、时序约束的主要方法…...

2022——寒假总结

文章目录背景报名摸索结果总结背景 大一上学期,刚上大学没有尽快适应,什么都没有学到。 因为疫情,所以平时的测试以及期末都是线上进行的,就没怎么认真学,网课直接划水。 我的生活与学习很不平衡,还热衷于参…...

C++11 Lambda表达式

文章首发公众号:iDoitnow 为什么引入Lambda Lambda表达式是一个可以内联在我们代码中的函数,我们可以将他传递给另外一个函数。在没有引入Lambda表达式之前,当我们遇到需要对多个数据,按照同一规则进行操作的时候,创建…...

冰湖灾害遥感监测评价与模拟分析

查看原文>>>mp.weixin.qq.com/s?__bizMzAxNzcxMzc5MQ&mid2247582638&idx1&sna22a1697b16a5edc2b74cb1ccf011689&chksm9be29cbeac9515a8227460103ae1b9f280af688eab0ce5a43448f9fa7c9cab820c389fcdc031&token10630879&langzh_CN#rd【专家简介…...

Highcharts.Chart

Highcharts 是一个使用javascript 脚本来生成图表的工具,和jfreechart 作用类似,都用来生成各种图表,并支持图片的导出和打印。 从官网 www.highcharts.com 上下载的压缩表中的example中有各种图表的例子。 要编写生成图表的例子建议从 文…...

遍历map的几种方法

#先往map加入几个数据 Map<Integer,String> mapnew HashMap<>(); map.put(1,"美好的周一"); map.put(2,"美好的周二"); map.put(3,"美好的周三"); 1 2 3 4 方法一&#xff1a;普通的foreach循环&#xff0c…...

RocketMQ源码分析之Broker概述与同步消息发送原理与高可用设计及思考

1、Broker概述 Broker 在 RocketMQ 架构中的角色&#xff0c;就是存储消息&#xff0c;核心任务就是持久化消息&#xff0c;生产者发送消息给 Broker,消费者从 Broker 消费消息&#xff0c;其物理部署架构图如下&#xff1a; 备注&#xff1a;以上摘录自官方 RocketMQ 设计文档…...

K8s常见面试题总结

部分内容来自&#xff1a;k8s面试题大全&#xff08;持续更新中&#xff09; 目录 k8s常考面试题 1.1.什么是k8s&#xff1f; 1.2.简述Docker和Kubernetes的关系 1.3.k8s的组件有哪些&#xff0c;作用分别是什么&#xff1f; 1.4.简述kubelet的功能和作用 1.5.简述pod是…...

OpenFeign 自定义解码器Decoder 失效

问题描述 项目上开发了OpenFeign的自定义解码器&#xff0c;用来统一处理返回结果。 开发完后测试已经生效了&#xff0c;过两天后&#xff0c;这块代码没有变动的情况下&#xff0c;发现请求结果突然又不走自定义的解码器了。 代码如下 解码器 BaseResponseFeignDecoder …...

c++练习题8

1&#xff0e;在do-while循环中&#xff0c;循环由do开始&#xff0c;用while结束&#xff1b;必须注意的是&#xff1a;在while表达式后面的 不能丢&#xff0c;它表示do-while语句的结束。 A&#xff09;0 B&#xff09;1 C&#xff09;&#xff1b;…...

Python循环语句代码详解:while、for、break

目录 1 while循环 1 while循环 循环语句是程序设计中常用的语句之一。任何编程语言都有while循环&#xff0c;Python也不例外。while循环的格式如下所示。 while(表达式): … else: … while循环的执行过程&#xff1a;当循环表达式为真时&#xff0c;依次执行whi…...

vue父子组件传值不能实时更新

最近做项目&#xff0c;遇到个大坑&#xff0c;这会爬出来了&#xff0c;写个总结&#xff0c;避免下次掉坑。 vue父子组件传值不能实时更新问题&#xff0c;父组件将值传给了子组件&#xff0c;但子组件显示的值还是原来的初始值&#xff0c;并没有实时更新&#xff0c;为什么…...

2023美赛A题思路数据代码分享

文章目录赛题思路2023年美国大学生数学建模竞赛选题&论文一、关于选题二、关于论文格式三、关于论文提交四、论文提交流程注意不要手滑美赛A题思路数据代码【最新】赛题思路 (赛题出来以后第一时间在CSDN分享) 最新进度在文章最下方卡片&#xff0c;加入获取一手资源 202…...

【蓝桥杯集训·每日一题】AcWing 3768. 字符串删减

文章目录一、题目1、原题链接2、题目描述二、解题报告1、思路分析2、时间复杂度3、代码详解三、知识风暴双指针一、题目 1、原题链接 3768. 字符串删减 2、题目描述 给定一个由 n 个小写字母构成的字符串。 现在&#xff0c;需要删掉其中的一些字母&#xff0c;使得字符串中不…...

Python|每日一练|树|深度优先搜索|数组|二分查找|链表|双指针|单选记录:填充每个节点的下一个右侧节点指针|搜索插入位置|旋转链表

1、填充每个节点的下一个右侧节点指针&#xff08;树&#xff0c;深度优先搜索&#xff09; 给定一个 完美二叉树 &#xff0c;其所有叶子节点都在同一层&#xff0c;每个父节点都有两个子节点。二叉树定义如下&#xff1a; struct Node { int val; Node *left; Node *rig…...

降雨量实时监测系统压电式雨量计

压电式雨量传感器由上盖、外壳和下盖组成&#xff0c;壳体内部有压电片和电路板&#xff0c;可以固定在外径50mm立柱上和气象站横杆上。传感器采用冲击测量原理对单个雨滴重量进行测算&#xff0c;进而计算降雨量。雨滴在降落过程中受到雨滴重量和空气阻力的作用&#xff0c;到…...

滑动相关的原理以及用滤波器实现滑动相关(匹配滤波器捕获DMF)

目录滑动相关匹配滤波器捕获&#xff08;DMF&#xff09;滑动相关 滑动相关属于一种时域捕获方法&#xff0c;其具体原理是是通过本地序列与接收信号在固定窗长内滑动累加得到相关结果。 一般滑动相关算法可以用于对自相关性非常好的伪码进行同步判决。 我们首先生成一组自相关…...

计算机网络笔记(三)—— 数据链路层

数据链路层概述 数据链路层以帧为单位传输数据。 封装成帧&#xff1a;给网络层提供的协议数据单元添加帧头帧尾 差错检测&#xff1a;检错码封装在帧尾 可靠传输&#xff1a;尽管误码不能避免&#xff0c;但如果可以实现发送什么就接受什么&#xff0c;就叫可靠传输 封装成…...

【日常】矩阵正态分布参数检验问题

最近给凯爹做的一个苦力活&#xff0c;统计检验这个东西说实话也挺有趣&#xff0c;跟算法设计一样&#xff0c;好的检验真的是挺难设计的&#xff0c;就有近似算法的那种感觉&#xff0c;检验很难保证size和power都很理想&#xff0c;所以就要做tradeoff&#xff0c;感觉这个假…...

QML矩形(Rectangle)

Rectangle 用于绘制矩形 常见的属性&#xff1a; 填充颜色&#xff1a;纯色&#xff1a;color 渐变 &#xff1a;Gradient类 渐变的优先级大于纯色Gradient&#xff08;渐变色&#xff09;&#xff1a; 渐变由多种颜色定义&#xff0c;这些颜色将无缝混合&#xff0c…...

CSS自定义鼠标样式

CSS自定义鼠标样式 属性值 属性描述url需使用的自定义光标的 URLdefault默认光标&#xff08;通常是一个箭头&#xff09;auto默认。浏览器设置的光标crosshair光标呈现为十字线pointer光标呈现为指示链接的指针&#xff08;一只手&#xff09;move此光标指示某对象可被移动e…...

春招Leetcode刷题日记-D4-双指针算法-滑动窗口快慢指针

D4-双指针算法-滑动窗口&&快慢指针快慢指针算力扣141. 环形链表思路代码力扣142. 环形链表 II思路代码滑动窗口力扣76. 最小覆盖子串思路代码力扣424. 替换后的最长重复字符思路代码快慢指针算 快慢指针算法&#xff0c;多用于链表当中&#xff0c;常见的如&#xff1…...

【go】结合一个go开源项目分析谷歌浏览器cookie为什么不安全 附go项目导包失败怎么解决教程

本文创作背景 源于谷歌浏览器提示密码被泄露 并且某站很快收到了异地企图登录的提醒。 当即怀疑是不是谷歌浏览器保存的密码不安全&#xff0c;最后查阅诸多资料 并找到一个go语言编写的开源项目进行研究&#xff0c;虽然最终不能确定密码是如何泄露的 但研究结论还是让人不由感…...

Windows瘦身方法

一、快速删除系统盘临时文件方法, 1、winr打开运行对话框&#xff0c;输入%temp%命令&#xff0c;如图1 图1 2、打开temp文件夹&#xff0c;如图2&#xff0c;选择所有文件&#xff0c;鼠标右键删除或按Del键删除。 图2 二、磁盘清理 1、winr&#xff0c;输入cleanmgr&#x…...

19. 删除链表的倒数第 N 个结点

题目链接&#xff1a;https://leetcode.cn/problems/remove-nth-node-from-end-of-list/进阶&#xff1a;你能尝试使用一趟扫描实现吗&#xff1f;解题思路&#xff1a;最简单的方法是先遍历一次链表&#xff0c;得到链表的长度len&#xff0c;然后再一次遍历链表&#xff0c;遍…...

【Linux】网络编程 - 基础概念

目录 一.OSI七层模型vsTCP/IP五层模型 1.一些周边概念 2.OSI七层模型 3.TCP/IP五层模型 4.网络传输流程图 二.什么是MAC地址 三.什么是IP/IP地址 1.什么是IP 2.什么是IP地址 四.什么是端口号 一.OSI七层模型vsTCP/IP五层模型 1.一些周边概念 局域网vs广域网 网络互…...

Unity 多语言 轻量高效的多语言工具集 LanguageManager

效果展示 支持excel导入自动化 组件化 更方便 也提供直接获取多语言的接口 没有挂 LanguageText的对象也可以获取多语言文本内容 支持 Format接口 可以传递N个参数进来组装多语言 支持首次系统语言自测 支持语言切换后本地自动保存配置 支持实时切换 同步刷新所有UI 容错处…...

在Linux和Windows上安装zookeeper-3.5.9

记录&#xff1a;378场景&#xff1a;在CentOS 7.9操作系统上&#xff0c;安装zookeeper-3.5.9。在Windows上操作系统上&#xff0c;安装zookeeper-3.5.9。版本&#xff1a;JDK 1.8 CentOS 7.9 zookeeper-3.5.9官网地址&#xff1a;https://zookeeper.apache.org/源码地址&…...

【ESP32+freeRTOS学习笔记-(八)资源管理】

目录1、 资源使用概况2、互斥方法之一&#xff1a;基本临界区2.1、taskENTER_CRITICAL_FROM_ISR() 和taskEXIT_CRITICAL_FROM_ISR()3、互斥方法之二&#xff1a;挂起或锁定调度程序3.1 vTaskSuspendAll()3.2 xTaskResumeAll()4 互斥方法三&#xff1a;互斥信号量&#xff08;和…...

c 能用来做网站吗/百度地图广告投放

2010年7月份&#xff0c;NASA和Rackspace公司将Openstack开源。到今天&#xff0c;Openstack马上六周岁了。而6周岁正是孩子上小学一年级的时候&#xff0c;Openstack是否也准备好上小学了呢&#xff1f; Openstack在刚开始的3年受到了整个市场的热捧&#xff0c;很多国际大牌不…...

建一个网站需要哪些费用/软文发布平台与板块

文/小伊评科技还是那个结论&#xff0c;我不认为现阶段的鸿蒙OS能够在手机这种载体上真正的挑战Android以及IOS&#xff0c;但是未来就不一定了。作为例子&#xff0c;早些年微软凭借WindowPhone以及对于诺基亚的扶持都没能从IOS和安卓手上抢下市场&#xff0c;反而最后落得一个…...

怎么做独立网站/网站设计制作哪家好

c2自r120之后允许用户自己添加插件 插件的目录为 info.xml files\myplugin\common.js files\myplugin\edittime.js files\myplugin\PluginIcon.ico files\myplugin\runtime.js info.xml文件主要是插件的基本信息 <?xml version"1.0" encoding"UTF-8…...

seo的中文含义/香港seo公司

进入Dos界面后&#xff0c;输入fdisk /mbr 不会损坏数据.转载于:https://www.cnblogs.com/wjonjon/archive/2009/09/15/1566735.html...

苏州淘宝网站建设培训/初学者做电商怎么入手

服务器py文件怎么连接数据库 内容精选换一换本章节适用于MRS 3.x之前版本。Loader支持以下多种连接&#xff0c;每种连接的配置介绍可根据本章节内容了解。obs-connectorgeneric-jdbc-connectorftp-connector或sftp-connectorhbase-connector、hdfs-connector或hive-connectorO…...

网站推广方案策划书/怎么可以让百度快速收录视频

熬夜删掉Linux中删除不掉的文件<?xml:namespace prefix o ns "urn:schemas-microsoft-com:office:office" />今天在做关于shell的作业时不知咋的生成了一个一–z开头的文件&#xff0c;怎么删都删不掉&#xff0c;如图&#xff1a;<?xml:namespace pref…...