Optimizing charge, linkDistance and gravity in d3 force-directed layouts

Question

I've built a force-directed layout of Senate voting patterns from the past session of Congress. There are 102 nodes and 2,600 edges, based on connecting any two senators who voted together at least 75 % of the time:

I've played with the coefficients for charge, gravity, and linkDistance quite a bit in hopes of finding a sweet spot where the nodes are not too clustered together or artificially separated. Using a linkDistance creates much more space than is logical between the four red nodes that connect the two clusters. Not setting a linkDistance causes the two clusters to drift far apart.

Are there any guidelines for choosing the right values, based on edge density or any other social network analysis metrics?

Current layout definition is:

var force = d3.layout.force()
    .nodes(d3.values(nodes))
    .links(d3.values(links))
    .size([width - 2 * margin, height - 2 * margin])
    .charge(-80)
    .gravity(0.25)
    .linkDistance(50)
    .on("tick", tick)
    .start();

Thank you!

UPDATE: This is a bit complex to get up on jsFiddle, but feel free to clone or fork on GitHub.

Answer 1

There are no "right" values -- the ones you might want to choose depend entirely on what you want to show.

There are however some metrics you can use as guidelines. The clustering coefficient is, as the name suggests, a measure of how "clustered" graphs are. This is a property of the whole graph, but you can also apply it to subgraphs (i.e. just the red or blue dots).

A related measure if the node degree, which basically counts the links between nodes. There are lots of other properties of graphs such as the Lovász number for example.

None of these will give you specific values for the parameters you want to set (and nothing will!), but you may find it useful to express those parameters in terms of some of these measures (e.g. set the link distance to the average node degree times a constant).