Graph doesn't occupy all the available width

[hkerma]

Hi, First, thank you for this adaptation of DAGRE in Cytoscape, it is great and very useful.

I'm using it to display a simple 5 nodes/7 edges DAG. The graph occupies all the available height, however it stays constraint in a very narrow width, preventing me from seeing the edges and edges' labels clearly. I tried to tweak with nodeSep, edgeSep and rankSep but I cannot achieve a convenient result.

I'd like the graph to occupy all the available width if possible. Is there a way to do so ? I don't know if I should play with "transform", a ranker algorithm, "boudingBox" and I'm looking for the easiest way to do it.

Find my algo options and the graph display I currently have. I enabled nodeDimensionsIncludeLabels even though I don't have any labels here (privacy reasons).

var layout_options = {
  name: 'dagre',

  // dagre algo options, uses default value on undefined
  nodeSep: undefined, // the separation between adjacent nodes in the same rank
  edgeSep: undefined, // the separation between adjacent edges in the same rank
  rankSep: undefined, // the separation between each rank in the layout
  rankDir: 'TB', // 'TB' for top to bottom flow, 'LR' for left to right,
  ranker: undefined, // Type of algorithm to assign a rank to each node in the input graph. Possible values: 'network-simplex', 'tight-tree' or 'longest-path'
  minLen: function( edge ){ return 1; }, // number of ranks to keep between the source and target of the edge
  edgeWeight: function( edge ){ return 1; }, // higher weight edges are generally made shorter and straighter than lower weight edges

  // general layout options
  fit: true, // whether to fit to viewport
  padding: 30, // fit padding
  spacingFactor: undefined, // Applies a multiplicative factor (>0) to expand or compress the overall area that the nodes take up
  nodeDimensionsIncludeLabels: true, // whether labels should be included in determining the space used by a node
  animate: false, // whether to transition the node positions
  animateFilter: function( node, i ){ return true; }, // whether to animate specific nodes when animation is on; non-animated nodes immediately go to their final positions
  animationDuration: 500, // duration of animation in ms if enabled
  animationEasing: undefined, // easing of animation if enabled
  boundingBox: undefined, // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
  transform: function( node, pos ){ return pos; }, // a function that applies a transform to the final node position
  ready: function(){}, // on layoutready
  stop: function(){} // on layoutstop
};

Best regards,

[maxkfranz]

Some suggestions:

• Take a look at the Dagre docs: https://github.com/dagrejs/dagre
• If you're unsure, treat the layout like a black block and try using it empirically.

[hkerma]

Thanks, I'll have a look.

[stale[bot]]

This issue has been automatically marked as stale, because it has not had activity within the past 30 days. It will be closed if no further activity occurs within the next 30 days. If a feature request is important to you, please consider making a pull request. Thank you for your contributions.