Cytoscape.js: Recalculate graph layout after mouse tab

Question

similar to this prototype http://jsfiddle.net/g5f16erz/ I use Cytoscape.js to create an interactive directed acyclic graph using the dagre layout.

In particular the following code is used to collapse and expand nodes:

cy.nodes().on('click', function(e) {
if (this.hasClass('open')) {
  this.removeClass('open');
  this.successors().removeClass('open').addClass('hidden');
} else {
  var children = this.neighborhood('.hidden');
  this.removeClass("collapsed");
  children.removeClass("hidden");
  children.incomers(".hidden").removeClass("hidden");
  this.addClass('open');
}
});

Is there a way to recalculate the layout of the graph every time a node has been collapsed or expanded?

Thanks in advance

maxkfranz · Accepted Answer · 2016-06-13 17:50:03Z

0

You can run a layout whenever you want. You can also run layouts on a particular subset of elements: http://js.cytoscape.org/#eles.layout

In your case, I suppose you'd just run the layout at the end of your event callback.

answered Jun 13, 2016 at 17:50

maxkfranz

12.3k1 gold badge30 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Cytoscape.js: Recalculate graph layout after mouse tab

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related