Here is an example of what I'm doing:
function showNeighbors(ele) {
cy.add(this.cyData.getElementById(ele.id()).neighborhood());
cy.elements().layout(layoutOpts);
}
This is the only why I can find to add the new nodes to the layout. I would like to add nodes similar to how D3 does by having a .enter() function or some way to add nodes to the current layout. Is this possible in Cytoscape.js?
Select a group of nodes in your network and again select Layout->Cytoscape Layouts->Grid. Notice that this now has a sub-menu with two options: All Nodes and Selected Nodes Only. Choose Selected Nodes Only. Note that only the nodes you selected are changed.
In addition to the ability to click on a node and drag it to a new position, Cytoscape now has the ability to move nodes using the arrow keys on the keyboard. By selecting one or more nodes using the mouse and clicking one of the arrow keys (←, ↑, →, ↓) the selected nodes will move one pixel in the chosen direction.
Description. The Dagre layout for DAGs and trees for Cytoscape.js (demo) The dagre layout organises the graph using a DAG (directed acyclic graph) system, written by Chris Pettitt. It is especially suitable for DAGs and trees. For more information, please refer to Dagre's documentation.
If the layout supports smooth transitioning (like Cola), just stop the layout on the old elements and start a new layout on the entire graph (including the new element): layout.stop(); layout = cy.elements().makeLayout(...); layout.run();
http://js.cytoscape.org/#layouts/layout-manipulation
If the layout doesn't support smooth transitioning, then it will still work but the animation won't necessary be smooth (e.g. a node may initially jump).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With