I am using cytoscape js with react cytoscape and cytoscape undoRedo and cytoscape expand collapse. On first render I want to have layout by preset(I have all node's positions). It works well but when i perform api.collapseAll() it looks like nodes does not have these positions. Even though groupped nodes have the same position as parent. On expand I want to use cose bilkent layout. Is there a way to do it?
import React, { useRef, useEffect, useState } from 'react';
import Cytoscape from 'cytoscape';
import CytoscapeComponent from 'react-cytoscapejs';
import COSEBilkent from 'cytoscape-cose-bilkent';
import undoRedo from 'cytoscape-undo-redo';
import expandCollapse from 'cytoscape-expand-collapse';
const Test = ({}) => {
const [cy, setCy] = useState(null);
useEffect(() => {
if (cy) {
const api = cy.expandCollapse({
layoutBy: {
name: 'cose-bilkent',
// name: 'preset', I want to have this layout on first render
animate: 'end',
randomize: false,
fit: false
},
fisheye: true
});
cy.undoRedo();
api.collapseAll();
}
}, [cy]);
return (
<CytoscapeComponent
stylesheet={styles}
cy={cy => {
setCy(cy);
}}
elements={elements}
style={{ width: '1200px', height: '1200px'}}
/>
);
}