求助：关于图形分组相关的需求实现求助 about g6 HOT 6 CLOSED

1、在graph.render()之后调用
const newGroup = graph.getGroup().addGroup({
id: 'newGroup',
name: 'newGroup'
// 其他配置省略
}) 创建新分组
2、创建新分组后const nodeGroup = graph.getGroup().find(i => i.cfg.id === '-node')获取到节点分组，将节点分组里你需要的元素(nodeGroup.cfg.children)移动到新分组，最后调用newGroup.toBack()置底新分组

from g6.

1、在graph.render()之后调用 const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup' // 其他配置省略 }) 创建新分组 2、创建新分组后const nodeGroup = graph.getGroup().find(i => i.cfg.id === '-node')获取到节点分组，将节点分组里你需要的元素(nodeGroup.cfg.children)移动到新分组，最后调用newGroup.toBack()置底新分组

// ...
graph.render()
const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup'})
const nodeGroup = graph.get('nodeGroup')
const cloneNodeGroup = cloneDeep(nodeGroup)
cloneNodeGroup.cfg.children.forEach((groupItem) => {
    if(groupItem.cfg.name === 'key') {
       newGroup.cfg.children.push(groupItem)
       nodeGroup.removeChild(groupItem)
    }
})
graph.get('comboGroup').set('zIndex', 0)
newGroup.set('zIndex', 1)
graph.get('edgeGroup').set('zIndex', 2)
nodeGroup.set('zIndex', 3)
graph.get('group').sort()
// ...

做了如下的验证，感觉好像通过 push 直接移到新创建的分组, 再操作排序。发现好像并没有搞定

你检查一下循环里push和remove操作的结果是否符合预期，我改了一下代码，是可以实现功能的。

 // ...
 graph.render()
 const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup' })
 const nodeGroup = graph.get('nodeGroup')
 for (let i = nodeGroup.cfg.children.length - 1; i >= 0; i--) {
   if (nodeGroup.cfg.children[i].cfg.item.getModel().type === 'site') {
     newGroup.cfg.children.push(nodeGroup.cfg.children[i])
     nodeGroup.cfg.children.splice(i, 1)
   }
 }
 graph.get('comboGroup').set('zIndex', 0)
 newGroup.set('zIndex', 1)
 graph.get('edgeGroup').set('zIndex', 2)
 nodeGroup.set('zIndex', 3)
 graph.get('group').sort()
 // ...

for (let i = nodeGroup.cfg.children.length - 1; i >= 0; i--) {
   if (nodeGroup.cfg.children[i].cfg.item.getModel().type === 'site') {
     newGroup.cfg.children.push(nodeGroup.cfg.children[i])
      nodeGroup.cfg.children.splice(i, 1)
   }
}

用nodeGroup.cfg.children.splice 移除元素搞定，已经达到预期。非常感谢！

from g6.

1、在graph.render()之后调用 const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup' // 其他配置省略 }) 创建新分组 2、创建新分组后const nodeGroup = graph.getGroup().find(i => i.cfg.id === '-node')获取到节点分组，将节点分组里你需要的元素(nodeGroup.cfg.children)移动到新分组，最后调用newGroup.toBack()置底新分组

谢谢！我去试试

from g6.

1、在graph.render()之后调用 const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup' // 其他配置省略 }) 创建新分组 2、创建新分组后const nodeGroup = graph.getGroup().find(i => i.cfg.id === '-node')获取到节点分组，将节点分组里你需要的元素(nodeGroup.cfg.children)移动到新分组，最后调用newGroup.toBack()置底新分组

// ...
graph.render()
const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup'})
const nodeGroup = graph.get('nodeGroup')
const cloneNodeGroup = cloneDeep(nodeGroup)
cloneNodeGroup.cfg.children.forEach((groupItem) => {
    if(groupItem.cfg.name === 'key') {
       newGroup.cfg.children.push(groupItem)
       nodeGroup.removeChild(groupItem)
    }
})
graph.get('comboGroup').set('zIndex', 0)
newGroup.set('zIndex', 1)
graph.get('edgeGroup').set('zIndex', 2)
nodeGroup.set('zIndex', 3)
graph.get('group').sort()
// ...

做了如下的验证，感觉好像通过 push 直接移到新创建的分组, 再操作排序。发现好像并没有搞定

from g6.

1、在graph.render()之后调用 const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup' // 其他配置省略 }) 创建新分组 2、创建新分组后const nodeGroup = graph.getGroup().find(i => i.cfg.id === '-node')获取到节点分组，将节点分组里你需要的元素(nodeGroup.cfg.children)移动到新分组，最后调用newGroup.toBack()置底新分组

// ...
graph.render()
const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup'})
const nodeGroup = graph.get('nodeGroup')
const cloneNodeGroup = cloneDeep(nodeGroup)
cloneNodeGroup.cfg.children.forEach((groupItem) => {
    if(groupItem.cfg.name === 'key') {
       newGroup.cfg.children.push(groupItem)
       nodeGroup.removeChild(groupItem)
    }
})
graph.get('comboGroup').set('zIndex', 0)
newGroup.set('zIndex', 1)
graph.get('edgeGroup').set('zIndex', 2)
nodeGroup.set('zIndex', 3)
graph.get('group').sort()
// ...

做了如下的验证，感觉好像通过 push 直接移到新创建的分组, 再操作排序。发现好像并没有搞定

你检查一下循环里push和remove操作的结果是否符合预期，我改了一下代码，是可以实现功能的。

 // ...
 graph.render()
 const newGroup = graph.getGroup().addGroup({ id: 'newGroup', name: 'newGroup' })
 const nodeGroup = graph.get('nodeGroup')
 for (let i = nodeGroup.cfg.children.length - 1; i >= 0; i--) {
   if (nodeGroup.cfg.children[i].cfg.item.getModel().type === 'site') {
     newGroup.cfg.children.push(nodeGroup.cfg.children[i])
     nodeGroup.cfg.children.splice(i, 1)
   }
 }
 graph.get('comboGroup').set('zIndex', 0)
 newGroup.set('zIndex', 1)
 graph.get('edgeGroup').set('zIndex', 2)
 nodeGroup.set('zIndex', 3)
 graph.get('group').sort()
 // ...

from g6.

nodeGroup.cfg.children.splice(i, 1)

三克油 我再检查检查

from g6.