treant-js icon indicating copy to clipboard operation
treant-js copied to clipboard

toggleCollapse is not adjusting the height of svg element

Open IOR88 opened this issue 6 years ago • 2 comments

Hi,

  1. The chart is rendered properly and all children are uncollapsed.
  2. When I click on very last root to collapse, all his children are hidden and tree is positioned(centered) properly in the svg element space.

The problem with point 1 is that the svg element is fitted to the current tree height. How this could be done, achieved ?

I have found in issues that this can be achieved with reload function and it works well, but it doesn't remember the session state of the tree it brings tree back to it initial state.

Is it possible to trigger reload() but with the current tree store data (including collapsed attribute) ?

onToggleCollapseFinished: function(treeNode, bIsCollapsed){
     treeNode.reload(); //possible to trigger this including current tree store state ?

}

Igor

IOR88 avatar Oct 12 '17 10:10 IOR88

Currently I am using treant together with react stack, I am building application with a flow that data views/components are updated when data is changed on stores. What I did now is:

onBeforeClickCollapseSwitch: function(nodeSwitch, event){
                        //trigger some logic to update store
                        return false;
 },

which stop update on treant tree store instance, instead of I am triggering changes on treant instance externally by store

this._chart.tree.reset({chart, nodeStructure}, this._chart.tree.id);
this._chart.tree.reload();

than when data component is receiving new data I am adding some class with opacity and spinner and text to indicate that redrawing is happening.

With this I have achieved kind of smooth treant chart updating but I have to leave animation for collapsing. So this is a temporary solution, but the initial problem is still there.

Is there a way to trigger some treant instane api in onToggleCollapseFinished to adjust svg height properly ?

IOR88 avatar Oct 12 '17 21:10 IOR88

A little late to the party, but for annoying coming here for the solution, I managed to achieve this by adding the following line into the function "positionNodes()" after the initialization of "self".

UTIL.setDimensions(` this.drawArea, this.drawArea.clientWidth, treeHeight + padding );

ThisIsIvan avatar Sep 04 '19 08:09 ThisIsIvan