in Node and Edge Graph Layouts

AIM:

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

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