Double tree partial layout

[zekelynch]

Hello!

Again, it is about the double tree layout…

We try to modify the tree layout dynamically(after the layout has been set): we need to remove some nodes and then partially re-layout the nodes into tree structure.

We somehow managed to do that using remove(), commitTransaction(), doubleTreeLayout(). Here’s the code:

data.forEach(v=>{
        let node = this.myDiagram.findNodeForKey(v.key)
        if(!v.check){
          if(node){
            this.myDiagram.remove(node);
            this.myDiagram.commitTransaction("deleted node");
          }
        }else{
          if(!node){
            this.myDiagram.model.addNodeData(v);
          }
          console.log('changeLinkData==>>>',node)
        }
      })
this.doubleTreeLayout(this.myDiagram);

However, the line connections were acting weird after the actions. These are some photo to visualize the problem:
1)

2)

]
3)

So, is there anyway we could fix the lines problem? Also, we lost the animation when we try to re-layout the nodes.

Thank you very much for helping us!

[walter]

Every call to commitTransaction should be preceded by a call to startTransaction.

Never execute a transaction within a loop. Instead, start the transaction before the loop and commit it after the loop is finished.

Use go-debug.js and check the console output window for messages.

I assume the value of data is an Array that is not === to myDiagram.model.nodeDataArray.