选择插件和删除边有个bug

[wtjperi2003]

Describe the bug

当直接单击连接桩产生一个边，再把边删除，然后选择节点，移动该节点，会发现选择框没有跟随。正常拖动连接桩产生的边就不会，看下图有演示。（顺便提一嘴，选择很多节点时，移动卡的动不了，这个问题希望能解决下）

Your Example Website or App

http://x6.antv.antgroup.com/examples/edge/connector/#normal

Steps to Reproduce the Bug or Issue

import { Graph,Shape } from '@antv/x6'
import {Selection} from '@antv/x6-plugin-selection'
const ports = {
    groups: {
        abs:{
            position: {
                name: 'absolute',
            },
            attrs: {
                circle: {
                    r: 4,
                    magnet: true,
                    stroke: '#5F95FF',
                    strokeWidth: 1,
                    fill: '#fff',
                    style: {
                        visibility: 'hidden',
                    },
                },
            },
        },
        top: {
            position: 'top',
            attrs: {
                circle: {
                    r: 4,
                    magnet: true,
                    stroke: '#5F95FF',
                    strokeWidth: 1,
                    fill: '#fff',
                    style: {
                        visibility: 'hidden',
                    },
                },
            },
        },
        right: {
            position: 'right',
            attrs: {
                circle: {
                    r: 4,
                    magnet: true,
                    stroke: '#5F95FF',
                    strokeWidth: 1,
                    fill: '#fff',
                    style: {
                        visibility: 'hidden',
                    },
                },
            },
        },
        bottom: {
            position: 'bottom',
            attrs: {
                circle: {
                    r: 4,
                    magnet: true,
                    stroke: '#5F95FF',
                    strokeWidth: 1,
                    fill: '#fff',
                    style: {
                        visibility: 'hidden',
                    },
                },
            },
        },
        left: {
            position: 'left',
            attrs: {
                circle: {
                    r: 4,
                    magnet: true,
                    stroke: '#5F95FF',
                    strokeWidth: 1,
                    fill: '#fff',
                    style: {
                        visibility: 'hidden',
                    },
                },
            },
        },
    },
    items: [
        {
            group: 'top',
        },
        {
            group: 'right',
        },
        {
            group: 'bottom',
        },
        {
            group: 'left',
        },
    ],
}
const edgeConfig={
    tools: [
      {
        name: 'button-remove',
        args: { distance: -40 },
      },
      {
        name: 'source-arrowhead',
        args: {
          attrs: {
            fill: 'red',
          },
        },
      },
      {
        name: 'target-arrowhead',
        args: {
          attrs: {
            fill: 'red',
          },
        },
      },
    ],
    markup: [
        {
            tagName: 'path',
            selector: 'line',
            className:'waterDrop',
            groupSelector: 'lines',
        },
        {
            tagName: 'path',
            selector: 'wrap',
            groupSelector: 'lines',
        },
    ],
    attrs: {
        lines: {
            connection: true,

        },
        line: {
            fill:'none',
            stroke:'rgba(25,91,181,0.28)',
            strokeWidth: 16,
            strokeDasharray: '5,0',
            targetMarker:null,
            strokeLinecap:'round',
            style: {
                animation: 'ant-line 60s paused infinite linear',
            },
        },
        wrap:{
            fill:'none',
            stroke:'transparent',
            strokeWidth:20
        }
    },
    connector:{
        name: 'rounded',
        args: {
            radius: 20,
        },
    }
}
const graph = new Graph({
  container: document.getElementById('container'),
  grid: true,
  connecting: {
      router: 'normal',
      connector: {
        name: 'smooth',
        args: {
          radius: 20,
        },
      },
      anchor: 'orth',
      connectionPoint: 'boundary',
      allowBlank:true,
      allowEdge:true,
      allowNode:false,
      snap: {
        radius: 20,
      },
      createEdge() {
        return new Shape.Edge(edgeConfig)
      },
      validateConnection({ sourceMagnet,targetMagnet }) {
        // console.log('validateConnection',targetMagnet)
        return true;
        // return true;
      },
    },
})
graph.use(
          new Selection({
            enabled: true,
            rubberband: true,
            strict: true,
            showNodeSelectionBox: true,
            showEdgeSelectionBox:true,
            pointerEvents:'none',
            className:'x6-selection',
            modifiers:'ctrl',
            following: true
          }),
      )
graph.addNode({
  id: 'a',
  x: 120,
  y: 40,
  width: 100,
  height: 40,
  attrs: {
    body: {
      fill: '#f5f5f5',
      stroke: '#d9d9d9',
    },
  },
  ports
})




// 控制连接桩显示/隐藏
  const showPorts = (ports, show) => {
    for (let i = 0, len = ports.length; i < len; i += 1) {
      ports[i].style.visibility = show ? 'visible' : 'hidden'
    }
  }
  graph.on('cell:mouseenter', () => {
    const ports = document.querySelectorAll(
        '.x6-port-body',
    ) 
    showPorts(ports, true)
  })
  graph.on('cell:mouseleave', () => {
    const ports = document.querySelectorAll(
        '.x6-port-body',
    ) 
    showPorts(ports, false)
  })

Expected behavior

选择框跟随

Screenshots or Videos

No response

Platform

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

Additional context

No response

[NewByVector]

selection 相关的问题我们正在考虑一次重构。

[favorite58]

selection 相关的问题我们正在考虑一次重构。

virtual开启后，直接使用代码选中若干可视区域外的节点会出现连线不渲染的情况，而且还不能重新连接，希望给解决一下，现在很多场景需要利用选中节点效果使关注的节点更明显
#4222