Force graph

Setting the title

• Press the set title button to supply the date of the event, the title of the event and the location of the event. These details will be pasted onto the graph.
• To change the title repeat the above instructions.

People in the network

• Click anywhere within the outlined space on your screen to add a ‘node’. This node represents a new person in your network. When prompted, type in a name (note: you cannot use the same name twice).

Showing Relationships between People

• Click on a node and drag it with the mouse to another node in order to add a link between the nodes (i.e. a link between people). This link visually represents the relationship between the two people.
• If you would like to delete a node or link, double-click on it.

Showing Importance or Significance

• You can change or customize the size of the nodes to show how important or central a node (person) is in the network. To change the size of a node, click on the node and press the Up and Down keys on the keyboard. Pressing Up will make the node bigger (i.e. this will show that the person that node represents is more important). Pressing Down will make the node smaller (and can be used to show that a person is less important in the visual network).

Showing Closeness and Strength of Relationships

• You can customize the width of the links to indicate the strength of a relationship. This will enable you to show where there are strong and weak relationships between people in the network. Wide links represent strong relationships and narrow links represent weaker relationships. Press the Left arrow key on the keyboard to make a link weaker (a narrow line) or the right arrow key to make a link stronger (a wider line).
• You can also modify the length of the links to indicate the proximity of a relationship (near or distant). Shorter lines between nodes represent close relationships while longer lines represent more distant relationships. Press the Down arrow key on the keyboard to reduce the distance between nodes or press the Up arrow key to extend the distance between nodes.

Showing Importance or Significance

• You can customize the links to show how relationships work in terms of either the flow of information between two people in the network or the direction of the relationship (one direction or mutual). To customise the relationship between two nodes, click on the link between them. This will toggle the link between the possible relationships, creating an arrow in the link that can be used to show the flow of information or the direction of a relationship between two nodes. You can choose whether there should be one arrow on the link pointing towards either of the two nodes (reflecting a one-directional relationship) or two arrows on the link (reflecting a mutual relationship).

• When you are done creating your network of nodes click the Finished button below.

We would like to extend our thanks to d3.js: https://d3js.org/ and the develepers of saveSvgAsPng: https://github.com/exupero/saveSvgAsPng.