Force directed graph: splitting nodes

This is a somewhat silly example of adding custom forces to a forceSimulation. All of the blue male nodes are pulled to the right side and all the pink female nodes are pulled to the left side.

There’s also a bounding box effect to stop the nodes receding into the void.

The custom force splitting_force() causes this effect. What’s a custom force? Click here for a refresher.

// bring all male nodes to right side, all female nodes to left side 
function splitting_force() { 
  for (var i = 0, n = nodes_data.length; i < n; ++i) {
    curr_node = nodes_data[i];
    if(curr_node.sex == "M"){
        curr_node.x += 5;
    } else if(curr_node.sex == "F"){
        curr_node.x -= 5;
    }    
  }
}

Hope you found that useful! Return here to view to the rest of the force directed graph series.