Our state of the art Gantt chart


Post by tso »

Hello,

We're implementing a custom "expand to level" function, but found no cascade function to easily propagate the expand function. Instead, we only foundbubble and traverse.

The problem however is that traverse ignores a "return false" and keeps calling the function redundantly for all its children. traverseUntil doesn't work because it stops entirely upon "return false", not just in that subtree.

timeline.collapseAll();
timeline.taskStore.rootNode.traverse(node => {
    if (node.childLevel < level) {
        timeline.expand(node);
    } else if (node.childLevel === level) {
        return false;
    } else if (node.childLevel > level) {
        console.log('Redundant call')
    };
});
  1. Is there a reason you don't provide a cascade function? I can easily loop over children recursively myself, but would rather rely on built-ins. Did I miss something?
  2. Why is a node-centric function like expand not defined on the node like in the sencha NodeInterface? Instead I have to call timeline.expand.

Thanks


Post by tso »

I tried to implement a custom cascade function, but it seems a bit slow. Not as slow as the traverse above, but still a noticeable lag on 150-200 nodes.

cascade = (node, fun) => {
   if (fun(node) && node.children) {
        node.children.forEach(child => this.cascade(child, fun));
    }
};
this.cascade(timeline.taskStore.rootNode, cascadeBy)

Perhaps there's a faster way? Like running query on the nodes with node.childLevel === level and bubbling up an expand function from there?


Post by pmiklashevich »

Hello,

There is expandTo function which expands all the chain to a certain task. Please try it out in console https://www.bryntum.com/examples/gantt/advanced/
Run line by line:

gantt.collapseAll()
// all nodes are collapsed now
gantt.taskStore.query(r => r.childLevel === 2, true).forEach(r => gantt.expandTo(r))
// nodes are expanded to the 2nd level tasks

Please also check out the implementation of the extandTo function in the sources. It uses toggleCollapse function with the 2rd argument equal to true, to skip unnecessary refreshing and improve the performance. Then refreshRows is called manually.

To make it work even faster than calling expandTo for each task and trigger refresh for each call, you can implement something similar to our expandTo, but collect all the records you need and call toggleCollapse on each with the 3rd argument equal to true. Then just refresh the rows manually.

Best,
Pavel

Pavlo Miklashevych
Sr. Frontend Developer


Post by pmiklashevich »

I've opened a feature request about having "cascade" for the TreeNode https://github.com/bryntum/support/issues/1513

Pavlo Miklashevych
Sr. Frontend Developer


Post by tso »

Thanks for looking into it and the provided tips. The provided function performed a bit worse than our own cascade, but there is definitely room for improvement in our implementation for bigger data sets. We might look into manual refreshing if the performance gets too bad.

Thanks for creating the feature request.


Post Reply