Force based layout
This week I have been working on implementing Force based layouting algorithm. Which was not such an easy task, that I haven't manage to finish completely.
Let’s start at the beginning. What is a force based layout (force directed layout)?
It is a drawing algorithm used to position the vertices (nodes) in a graph by using force system applied between edges and vertices.
Usually, we use spring-like attractive forces to attract pairs of endpoints of edges towards each other, and at the same time, repulsive forces, similar to ones of electrically charged particles, to separate all pairs of nodes.
In a balanced state of this system, the edges tend to have a uniform length (because of spring force) and nodes that are not connected with an edge, tend to be further apart (because of electrical repulsion).
Here is an interactive force based layout.
Try moving one vertex (by clicking on it and dragging it). How the rest of the group is reacting?
Notice that they are following, but not exactly, even the one we explicitly moved is not staying in the chosen place. So we get a bit different representation, after moving one node. Why is this happening?
Well, because of the forces we are choosing. By changing the position of one node, the force for this node and his edges, change. This change affects the movement of the rest of the nodes.