Implementing a force-directed graph

A force-directed graph is a way of drawing an aesthetic graph using simple physics such as repealing and springs. We are going to make our graph interactive so that users can drag nodes around and see how graph reorganizes itself.

Getting ready

In this recipe we are going to use the code base from the Creating a particle system in 2D recipe in Chapter 5, Building Particle Systems. To get some details of how to draw nodes and connections between them, please refer to the Connecting particles recipe in Chapter 6, Rendering and Texturing Particle Systems.

How to do it…

We will create an interactive force-directed graph. Perform the following steps to do so:

1. Add properties to your main application class.

   vector< pair<Particle*, Particle*> > mLinks;
   float mLinkLength;
   Particle*   mHandle;
   bool mIsHandle;

2. In the setup method set default values and create a graph.

   void MainApp::setup(){
     mLinkLength = 40.f;
     mIsHandle   = false;
   
     float drag = 0.95f;
   ...