Layouts

# graph.layout([layout])

Adds one or more layouts to the graph. Without the argument, this method returns the array of layouts already added to the graph.

» myLayout = require('myLayout');
» graph.layout(myLayout);
» graph.layout();
["My first layout"]

In its most simple (and probably most useless) form a layout is created by calling the factory method in layouts/abstract.js:

var makeLayout = require('layouts/abstract');

module.exports = function() {
  
  var myLayout = function(config) {
    // Add configuration code for this layout here.
    return myLayout;
  };

  myLayout.toString = function() {
    return 'My first layout';
  };

  return makeLayout(myLayout);
};

# layout.alpha(vertex)

This method is called by the graph for each layout from within its own alpha() method to calculate the overall “heat” of the whole graph.

If your layout has no influence on the graph’s global motion you either just will not want to override this method at all, or you can simply return 0.

# layout.bbox(vertex)

Define this method in a layout to return the bounding box of the elements added to the vertex’ SVG element. It is going to be called whenever graph.bbox(vertex) calculates the compound bounding box of all elements defining the visual appearance of the vertex.

myLayout.bbox = function(vertex) {
  var graph = myLayout.graph();
  var myElement = graph.select(vertex).select('.myLayoutElement');
  var vertexBbox = vertex.bbox();

  var node = myElement.node();

  if (node) {
    var svgRect = node.getBBox();
    var translate = d3.transform(myElement.attr('transform')).translate;

    var bbox = {
      width: svgRect.width,
      height: svgRect.height,
      left: vertexBbox.cx + translate[0],
      top: vertexBbox.cy + translate[1]
    };

    bbox.right = bbox.left + bbox.width;
    bbox.bottom = bbox.top + bbox.height;

    return bbox;
  }
};

# layout.graph()

This method is automatically added by the layout factory method in layouts/abstract.js and always returns the reference to the current graph. This can be used to access the graph’s properties, e.g. vertices and edges, size etc.

# layout.refresh()

The corresponding graph calls this method in each layout from within its own refresh() method, triggered by a timer. Note: This method might be removed in a future version to encourage asynchronous refreshing from within the layout itself, independent from the core.

# layout.start()

This method is called by the graph for each layout from within its own start() method.

# layout.stop()

This method is called by the graph for each layout from within its own stop() method.

# layout.add(layout, graph)

Add one or more layouts (as array) to a graph.

# layout.collection()

Returns the array of layouts added so far.

# layout.stop()

This method is called by the graph for each layout from within its own stop() method.

# layout.toString()

Override this method to label a layout as desired. (See above for an example.)