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

@antv/x6 利用interacting方法来设置禁止结点移动的方法实现。

1、官网有个设置说明。

https://x6.antv.antgroup.com/api/graph/graph

2、然后有可行的方法一:

let graph = new Graph({container: document.getElementById('container'),interacting: function (cellView) {if (cellView.cell.getData() != undefined && !cellView.cell.getData().disableMove) {return { nodeMovable: false };}return true;},grid: true,panning: {enabled: true,modifiers: 'shift',},
...
}

这里最主要是这段代码:

interacting: function (cellView) {if (cellView.cell.getData() != undefined && !cellView.cell.getData().disableMove) {return { nodeMovable: false };}return true;},

2.1、最后我们在增加节点的时候,加入下面代码:

nodes.push({shape: 'custom-node',x: item.x,y: item.y,id: item.id,width: item.size,height: item.sizeh,data: {disableMove: false, //true为可拖拽,false不可拖拽},
....
});
data: {disableMove: false, //true为可拖拽,false不可拖拽},

3、另一种方法:

interacting(cellView) {// if (cellView.cell.getData() != undefined && !cellView.cell.getData().disableMove) {return { nodeMovable: false };// }// return true;},

只要加上将第一种方法中的几行注掉,就可以了。

参考:

解决 antv x6 配置了限制节点、边移动不生效问题_antvx6设置节点禁止拖动,禁止改变大小-CSDN博客

antv x6控制每个图元是否可拖拽_antv x6 禁止拖拽-CSDN博客

相关文章:

  • 《Unity3D高级编程 主程手记》第四章 用户界面(四) UGUI 核心源码
  • ctfshow-web入门-sql注入(web171-web175)
  • 【QT】qss
  • 01 LVS负载均衡群集
  • Android进程保活:如何让app一直运行
  • DynamicDataSource多数据源的管理,动态新增切换数据源
  • Linux 内核源码分析---文件系统关联与字符设备操作
  • windows环境下安装docker与jenkins进行单机简易安装
  • PHP智能问诊导诊平台-计算机毕业设计源码75056
  • 数据库分表
  • 【探索Linux】P.44(数据链路层 —— 以太网的帧格式 | MAC地址 | MTU | ARP协议)
  • 免费【2024】springboot 大学校园旧物捐赠网站的设计与实现
  • 跟《经济学人》学英文:2024年08月03日这期 GPT, Claude, Llama? How to tell which AI model is best
  • pfx如何配置到nginx中
  • RS485 CAN SPI IIC UART RS232这些通信协议传输距离、传输速度对比给出比较顺序-笔记(面试必备)
  • eclipse(luna)创建web工程
  • es6(二):字符串的扩展
  • Java精华积累:初学者都应该搞懂的问题
  • JS基础之数据类型、对象、原型、原型链、继承
  • js中的正则表达式入门
  • LeetCode18.四数之和 JavaScript
  • Markdown 语法简单说明
  • PermissionScope Swift4 兼容问题
  • Storybook 5.0正式发布:有史以来变化最大的版本\n
  • 构造函数(constructor)与原型链(prototype)关系
  • 机器学习中为什么要做归一化normalization
  • 如何胜任知名企业的商业数据分析师?
  • 思否第一天
  • 一加3T解锁OEM、刷入TWRP、第三方ROM以及ROOT
  • 智能网联汽车信息安全
  • 格斗健身潮牌24KiCK获近千万Pre-A轮融资,用户留存高达9个月 ...
  • 如何在 Intellij IDEA 更高效地将应用部署到容器服务 Kubernetes ...
  • 专访Pony.ai 楼天城:自动驾驶已经走过了“从0到1”,“规模”是行业的分水岭| 自动驾驶这十年 ...
  • #Datawhale AI夏令营第4期#AIGC方向 文生图 Task2
  • #QT(智能家居界面-界面切换)
  • #设计模式#4.6 Flyweight(享元) 对象结构型模式
  • #数据结构 笔记一
  • #我与Java虚拟机的故事#连载19:等我技术变强了,我会去看你的 ​
  • $forceUpdate()函数
  • (1)(1.9) MSP (version 4.2)
  • (C++20) consteval立即函数
  • (附源码)php投票系统 毕业设计 121500
  • (回溯) LeetCode 78. 子集
  • (解决办法)ASP.NET导出Excel,打开时提示“您尝试打开文件'XXX.xls'的格式与文件扩展名指定文件不一致
  • (数位dp) 算法竞赛入门到进阶 书本题集
  • (万字长文)Spring的核心知识尽揽其中
  • (转)重识new
  • .net/c# memcached 获取所有缓存键(keys)
  • .NET/C# 中设置当发生某个特定异常时进入断点(不借助 Visual Studio 的纯代码实现)
  • .NET8 动态添加定时任务(CRON Expression, Whatever)
  • .net的socket示例
  • .NET高级面试指南专题十一【 设计模式介绍,为什么要用设计模式】
  • .net连接MySQL的方法
  • .NET中两种OCR方式对比
  • .Net组件程序设计之线程、并发管理(一)