Node on Effective Graph Layout: Key Factors

KEY FACTORS 
in Node and Edge Graph Layouts

AIM:

        "Getting the message across in the simplest layout without confusing the user."

                  Most Intuitive Layout Vs Most Semantic Meaning -> a Ink : Data ratio
                                   
                                                         
METRIC: Ink : Data ratio  ->  Amount of Ink used  : to : Amount of Data Visualised


VARIABLES: Node Type,
                         Edge Type,
                         Node Grouping
                         Node/Edge Position
  These are 4 main variable in a graph which can be changed to improve this ink : data ratio

KF: Complexity - Sometime the nodes are so connected that it seem every node is connected with one edge to every other node. This sometimes masks those nodes which are less connected i.e have less edge attached. This complexity of connections makes the graph layout look messy and it becomes difficult to interpret.
SOLUTION: Use groups so that every node in that group is connected by an edge to every node in another group. Then it easy to see that the less connected node are those with less edges attached.
EXAMPLE: The 1st Graph look's like all node are connected to every other node but the 2nd Graph shows 3 is not connected to 5 or 1 so not well connected in fact not all nodes are connected to every other node.
VARIABLES: Reduce Amount of Edges and Add more Groups

Reduce Complexity by Grouping Node on their Edge Connections

TECHNICAL SOLUTION: cola.js using d3.js  Simple (0) -- Difficult(5) : to USE 0 to DEVELOP 4     see example