Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

群组不支持框选/多选节点嵌入 #3636

Open
zzyyu opened this issue May 31, 2023 · 5 comments
Open

群组不支持框选/多选节点嵌入 #3636

zzyyu opened this issue May 31, 2023 · 5 comments
Labels
bug:selection selection plugin bug

Comments

@zzyyu
Copy link
Contributor

zzyyu commented May 31, 2023

Describe the bug

当使用框选/多选功能时,选择多个节点
将选择的多个节点移动到群组中,群组节点只会将鼠标移动的节点嵌入群组节点内
其它被选中的节点未自动嵌入

Your Example Website or App

https://codesandbox.io/s/vibrant-pare-yqc3if?file=/index.ts

Steps to Reproduce the Bug or Issue

  1. 将多个节点位置集中
  2. 选中/框选多个节点
  3. 移动框选中的子节点到群组节点内

Expected behavior

群组节点支持批量嵌入功能
embedding中的findParent、validate支持批量节点的验证

Screenshots or Videos

image

Platform

  • OS: [e.g. macOS, Windows, Linux]
  • Browser: [e.g. Chrome, Safari, Firefox]
  • Version: [e.g. 91.1]

Additional context

No response

@x6-bot
Copy link
Contributor

x6-bot bot commented May 31, 2023

👋 @zzyyu

Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it.
To help make it easier for us to investigate your issue, please follow the contributing guidelines.
We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

@NewByVector NewByVector added the bug:selection selection plugin bug label Jun 4, 2023
@PatrickChen928
Copy link

Any progress on this?

1 similar comment
@huihui925
Copy link

Any progress on this?

@ADAM00o00
Copy link

我使用如下方法来支持框选节点嵌入。在实现的时候,我发现node.setParent方法失效,但是没花时间去尝试复现了,大家可以看下。

    embedding: {
      enabled: true,
      findParent({node}) {//拖动节点时,执行该函数
        const bbox = node.getBBox();
        //寻找节点的父节点
        const parentNodes = this.getNodes().filter((cell) => {
            const parentBbox = cell.getBBox();
            //如果节点的bbox和该群组节点的bbox相交,则群组节点是该节点的父节点
            if (bbox.isIntersectWithRect(parentBbox)) {
              const nodes = this.getSelectedCells();
              /**
               * 注:antV x6的框选节点功能不能把被框选的其他节点一同设置为子节点
               * 采用如下方法将当前框选的节点一并设置为群组节点的子节点
               * 有可能出现被框选的节点没有和群组节点相交,也被设置为子节点的情况
               * 但是用户已经框选一些节点并将其中一个节点拖进群组了,就认为他的目的就是一起设置
               * 下面删除parent也是一样
               */
              nodes.forEach((node) => {
                //不知道为啥,node.setParent(cell)不生效,只能用addChild
                cell.addChild(node);
                node.getData().parent = cell.id;
                //为了避免节点被群组节点遮罩,设为最顶层
                node.toFront();
              })
              return true;
          }
          return false;
        })
        //如果没有找到任何父节点,则删除该节点的parent属性(移出群组)
        if (parentNodes.length === 0) {
          const nodes = this.getSelectedCells();
          nodes.forEach((node) => {
            //由于node.setParent(null)不生效,而且parent.removeChild会直接删除节点
            //所以只能先过滤出删除后的子节点,再重新设置子节点
            const parent = node.getParent();
            if (parent) {
              parent.setChildren(parent.filterChild((child) => child !== node))
            }
          })
        }
        return parentNodes;
      },
    },

@Ardanas
Copy link

Ardanas commented Sep 3, 2024

Any progress on this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug:selection selection plugin bug
Projects
None yet
Development

No branches or pull requests

6 participants