antv x6填坑指南：部分节点拖拽和操作撤销重做不生效问题、使用Stencil过滤时过滤后分组的显示高度无法根据过滤节点自适应问题

原创

已于 2023-12-04 15:29:12 修改 · 2.6k 阅读

10 ·

CC 4.0 BY-SA版权

文章标签：

#antv x6 #前端 #拓扑图

于 2023-12-04 15:22:09 首次发布

问题1. 部分分组中节点拖拽添加或操作后撤销重做操作不生效。

前提：使用Stencil插件，创建画布侧边栏的 UI 组件，同时使用其分组、折叠能力。分组包含固定分组、后台接口获取的动态分组和组件。

//固定分组初始化
initStencil (graph, stencil) {
   
   
//defaultGroup是固定分组和其节点信息，自行添加
      defaultGroup.forEach((gp, index) => {
   
   
        const groupName = 'common-group' + index
        const group = {
   
    name: groupName, title: gp.name || '未命名', collapsable: true }
        stencil.addGroup(group)
        const nodes = gp.children.map(item => {
   
   
          let node
          if (item.data.nodeType !== specilNodeType.GroupNodeType) {
   
   
            node = graph.createNode({
   
   
              shape: 'custom-vue-node',
              width: 166,
              height: 32,
              data: {
   
    nodeGroup: gp.key, ...item, ...(item.data || {
   
   }), isStencil: true, data: null }
            })
          } else {
   
   
            node = graph.createNode({
   
   
              shape: 'group-vue-node',
              width: 166,
              height: 32,
              data: {
   
    nodeGroup: gp.key, ...item, ...(item.data || {
   
   }),