How to save collapsed status of nodes in json data?

[hotpeperoncino]

I'd like to save the node status whether the node is collapsed or not in json data, and then restore it to the visualized graph with keeping the collapsed status. When using some libraries "collapsed" member in json data indicates the collapsed status of each nodes. For example, the collapsed status can be stored as other json data, then after loading the elements json, according to the collapsed status json, the collapsed function can be applied to the graph.
What method is supposed as the regular method in this library?

[royludo]

For now, you could use the data('collapsedChildren') attribute of the element for that. It stores the children of this element, when it is collapsed. So if yourElement.data('collapsedChildren') is defined and contains things, then yourElement is collapsed.

[hotpeperoncino]

Thank you for your reply. I wonder that json like { "data": {"id": "1", "text":"a", collapsedChildren: [ { "id":"2", "text":"b"}, {"id":3","text":"c"}] } } can be restored as collapsed graph.

[royludo]

What is saved inside collapsedChildren is the entire cytoscape element. With all the cytoscape properties, as is. So I'm not sure that what you propose would work...

[hotpeperoncino]

I see. It looks reasonable that I would load graph json data containing collapsed marked element data, then after loading graph json data, applying collapsing function to the marked nodes by traversing the loaded elements. Thank you for your comment!

[hotpeperoncino]

And when saving data, the mark meaning collapsed node should be updated and the elements are exported with the marks.

[stklik]

I'm also interested in this feature, however I would like to define upfront which compounds are collapsed/expanded (i.e. directly from the JSON source). This means that it would be a bit tedious to fill collapsedChildren by hand. It would be nicer if the parent had a feature that would be looked at upon loading.

[kinimesi]

@hotpeperoncino one way of saving collapsed nodes is the following. First you need to get all collapsed children in the graph. In v3.0.11, you can use getAllCollapsedChildrenRecursively method. Then take union of the collapsed children with current nodes.

var allNodes = cy.nodes();
allNodes = allNodes.union(api.getAllCollapsedChildrenRecursively());

Now you have all the nodes in the graph. When saving the nodes, you need to save the collapse state of nodes too. Just saving the state of collapsed nodes is sufficient (no need to save the state for all nodes). You can get the nodes which are collapsed as follows and set their state:

var collapsedNodes = allNodes.filter(".cy-expand-collapse-collapsed-node");
collapsedNodes.data("collapse", true);  // state stored in collapsed field

After saving nodes with collapsed state, it is easy to get them back: load it as usual, after loading, collapse the nodes which were collapsed before. Let's say, you store the status in a data field called collapse, then you can collapse them like this:

// collapse nodes
if (cy.nodes("[collapse]").length > 0 ){
    cy.expandCollapse('get').collapse(cy.nodes("[collapse]", {layoutBy: null}));
}

[kinimesi]

@stklik First define the compounds which are collapsed by adding an attribute to their data field - for example "collapse" : true. No need to do this for expanded compounds. After loading the graph, just collapse nodes whose related data field is set:

// collapse nodes
if (cy.nodes("[collapse]").length > 0 ){ // assuming collapse state is stored in collapse data field
    cy.expandCollapse('get').collapse(cy.nodes("[collapse]", {layoutBy: null}));
}

[aprudnikoff]

As well you broke a core cy.json() method, now it produces not JSON-serializable object since it has circular links.

[bentole]

I have created a workaround which allows for collapsed graphs to be stringified and saved to backend and restored thus avoiding the dreaded cyclic object issue. I am uncertain if there is a more elegant way to do this?

workaround here if anyone is interested..

Also thanks alot for this superb cytoscape extension!

[itf]

I made a different workaround inspired by bentole's workaround.

Before any function that could get messed up because of collapsed nodes, I uncollapse them by calllng collapseFix on those nodes, and afterwards I call collapseFixRestore.

Here is the workaround

[canbax]

@itf @bentole @hotpeperoncino Now unstable version has loadJson and saveJson functions. You can try it and maybe close this issue it works fine.