Graph topic panel

Latest revision as of 19:43, 6 April 2015

Graph topic panel is one of the several available topic panels in Wandora. The graph topic panel views topics as graph nodes and associations as edges between the topic nodes. A node is a colored rectangle with topic's name. The color represents a class of the topic. The edge is a colored line between nodes. The color of the line represents association's type. Association type and roles are viewed when user takes the mouse pointer over line. If association connects more than two topics i.e. it is a hyper-edge, the line branches to each topic node. Next image views an example of graph topic panel.

[edit] Activating the graph topic panel

The graph topic panel is not a default visualization in Wandora and the user has add the graph topic panel into the Wandora. A graph topic panel is added to the Wandora by selecting a menu option View > New panel > Graph. The user may add several independent graph topic panels into the Wandora.

[edit] Editing topics in the graph

The graph topic panel doesn't allow the user to edit topic's internals. To edit topic's internal structures you need to change topic panel to Traditional or Tabbed topic panel. However, the graph topic panel allows the user to apply topic editing options to a set of node selection. These topic editing options locate in the context menu, below menu option Topics. For example, context menu option Topics > Base names > Modify base names with a regex applies given regular expression into the topic in selection and possibly alters base names.

See chapter Mouse modes below to get familiar with the association drawing.

[edit] Force-directed graph

The graph is force-directed i.e. nodes are assigned forces based on their positions, and these forces have an effect to the motion of the nodes.

Thus, the graph is animated and node positions change automaically. As the time passes, the graph gets usually clearer and finds a balance. However, some times when nodes have very much edges, the graph may end up animating very rapidly and the animation looks like a random mess. In this case it is good to stop the animation and filter out some edges.

[edit] Moving and zooming the graph

The user can zoom in and out the graph. To zoom the graph, user should use the mouse wheel or the magnifier button widget in the buttonbar to the left of the graph.

To center the graph, the user can select context menu option Center graph or click Center current topic node button. If you have closed or filtered the current topic node, centering doesn't work.

To move the complete graph the user should have the mouse move mode activated, and drag the graph background with the mouse. To rotate the graph the user should keep SHIFT key pressed while dragging the graph background woth the mouse.

To move single node the user should have the mouse move mode activated, and drag the node rectangle. As the graph is force-directed, moving a node may drag other nodes into other positions.

See chapter Mouse modes below.

[edit] Expanding the graph

A fresh graph topic panel views a topic with it's immediate topic neighbours in the panel. The user can expand the graph either by expanding graph nodes and by sending topics to the graph.

A graph node is extended by right mouse clicking it and choosing a context menu option Expand node.

A topic is sent to a graph with a topic context menu option Open topic in > Graph w .... Topic context menu options Open topic in can be found in many places in the application, in the topic tree, for example.

To expand nodes recursively the user can choose a context menu option Expand nodes recursively. To make recursive expansion, the user must enter a recursion depth. Recursion depth is a positive integer number usually bigger that 1.

A graph node is closed by selecting the menu option Close nodes in context of the node. Closed nodes can be opened again.

To close all nodes but the current, the user can choose context menu option Close all nodes but.

[edit] Hyperbolic projection and projection curvature

The graph topic panel views the graph in a 2D-hyperbolic projection. Hyperbolic projection views nodes in the center bigger. The user can change the strength of the hyperbolic perpective. The strength, or curvature, is changed by rolling the mouse wheel while the SHIFT key is pressed down. Also, the curve widget button can be used to change the hyperbolic strength. If the hyperbolic strength, curvature, is large enough, Wandora views a graph horizon, a grey circle around the graph. No node and no edge can ever cross the graph horizon.

Next two images view same graph with two different projection curvatures. Projection curvature of the first graph is 84 while the projection curvature of latter graph is 1. The grey circle around the first graph is the graph horizon. The user should notice that the projection of latter graph is nearly a plane projection.

[edit] Animation and framerate

The graph is animated by default. To stop the graph animation, the user can right click the topic panel and choose context menu option Toggle animation. Choosing the menu option while the animation is stopped, starts the animation.

Animation framerate is 25 frames per socond by default. Real framerate is viewed at the bottom right corner of the graph topic panel. User's computer and the graph size sets limits to the real framerate.

Sometimes while viewing a large graph it may be handy to lower the framerate of the graph topic panel. Framerate is changed with the fps button widget on the right side of the panel. Framerate also affects the responsivity of user interactions. Thus, with a small framerate, moving the graph feels like a stop motion animation.

[edit] Pinning nodes

The graph is animated by default. Sometimes the user may want to lock the position of some nodes while the rest of the graph is still animated. This position locking is called pinning. To pin a node the user can right mouse click over a node, and choose menu option Pin nodes > Set selection pinned. A pinned node has an emphasized black edge.

To release pinning of a single node the user should select menu option Pin nodes > Set selection unpinned.

To pin all nodes the user should select menu option Pin nodes > Set all pinned. To release all pinned nodes the user should select menu option Pin nodes > Set all unpinned. To reverse the pinning status of all nodes the user can select menu option Pin nodes > Reverse pinning.

[edit] Filtering nodes and edges

Usually the graph becomes very dense if the user open hundreds of nodes. The user can filter out unwanted nodes with context menu options below Filter nodes and unwanted edges with context menu options below Filter edges.

To release filtered nodes the user can choose menu option Clear all node filters. Similarly, all edge filters are released by choosing a menu option Clear all edge filters. To release a specific filter, the user should use menu options below Release node filters and Release edge filters.

The user can select to view filter status top right corner of the graph topic panel by choosing a context menu option Options > View filter info. Choosing the menu option again hides filter status text.

[edit] Mouse modes

On the left side of the graph panel locates mouse mode buttons. A mouse mode defines how the graph topic panel interprets mouse clicks, mouse movements, and mouse drags. Available mouse modes are:

Move mode
Select mode
Association mode

[edit] Move mode

While the move mode is active, the mouse moves the graph and the graph nodes.

To drag the graph, press left mouse button on the panel background, keep the mouse button down and move the mouse.

To rotate the graph, keep SHIFT key pressed while dragging the mouse over the panel background. The graph is rotated around the current node.

To move a single topic node, press left mouse button over a node, keep the mouse button down and move the mouse. Notice, the node may change it's position after you have eleased the mouse button as the graph has it's own dynamics.

To lock a position of a node on graph, select context menu option Pin nodes > Set selection pinned over the node. To release a pinned node, select context menu option Pin nodes > Set selection unpinned. Pinning and unpinning nodes works in all mouse modes.

[edit] Select mode

The select mouse mode enables the user to draw closed paths on the graph panel. The graph panel selects nodes within the closed curve. Selected nodes are colored gray-blue.

To select single node the user can also click on the node. Previous selection is cleared unless the user holds the SHIFT key pressed while clicking on the node.

To select nodes of certain type or with certain property, the user can use selection tools found in the Select menu. Available selection tools allow the user to select topics without classes or instances, for example. The select menu is available in all mouse modes.

[edit] Association mode

While the association mouse mode is active, the mouse behavior resembles move mouse mode except that clicking left mouse button over a node activates Draw association. To draw an association the user should press left mouse button over a topic node and drag the mouse over another topic node. A line is drawn from the source node to the mouse pointer during drag. When the user releases the mouse button over a node, an association editor is viewed. By default the association editor views addressed topics as association players. To create a valid association the user should choose association type and roles, and confirm association creation.

[edit] Exporting the graph

To export the graph the user can select context menu options under Export graph as. Context menu is revealed by right mouse clicking the graph.

Available export formats are DOT, GraphML, GraphXML and GML.

Only visible nodes and edges are exported.

The user should not mix these Export graph as options with options that locate under Topics > Export. Latter options sees the graph as a topic collection and exports topics.

To copy the graph as an image to the system clipboard the user can use context menu option Copy as image. The user can then paste the image to a word processor, for example.

[edit] See also

Beside the graph topic panel, Wandora features an embedded server with a D3 graph service module that implements an alternative graph visualization.

@@ Line 1: / Line 1: @@
-Graph topic panel is one of several available [[topic panels]] in Wandora. Graph topic panel is activated in Wandora selecting '''View > Topic panels > Graph topic panel'''. Graph topic panel views topics as graph nodes and associations as edges between topic nodes. A node is a colored rectangle with topic's base name. Node color represents classes of the represented topic. Edge is a colored line between nodes. Color of the line represents association's type. Association type and roles are viewed when user takes the mouse pointer over line. If association has more than two members, the line branches to each player node.
+Graph topic panel is one of the several available [[topic panels]] in Wandora. The graph topic panel views topics as graph nodes and associations as edges between the topic nodes. A node is a colored rectangle with topic's name. The color represents a class of the topic. The edge is a colored line between nodes. The color of the line represents association's type. Association type and roles are viewed when user takes the mouse pointer over line. If association connects more than two topics i.e. it is a hyper-edge, the line branches to each topic node. Next image views an example of graph topic panel.
-When user selects to view a topic in Graph topic panel, the topic and it's neighbors are shown. User may expand the initial graph by clicking topic nodes or selecting '''Expand node''' in context menu of topic node. Opening a topic with topic tree also expands the graph with opened topic. User may also close nodes selecting '''Close nodes''' in context menu of topic node. Node filtering is also possible. Wandora keeps filtered nodes hidden regardless node expansions while closed nodes pop open again while expanded.
-Graph topic panel also has '''current topic''' but you can't edit it's internal structures such as subject identifiers or variant names. To edit topic's internal structures you need to change topic panel to [[Traditional topic panel|Traditional]] or [[Tabbed topic panel]].
+[[File:graph_topic_panel_example_01.gif|center]]
-To zoom in and out the graph panel use mouse wheel. To change the curvature of graph perspective press SHIFT key while rolling the mouse wheel. If the curvature is large enough, Wandora views a graph horizon, a gray circle around the graph. Graph can't cross the horizon although it can be infinite close to it. To center the graph select '''Center graph''' or click Center current topic node button. If you have closed or filtered the current topic node centering doesn't work.
+== Activating the graph topic panel ==
-To stop graph animation right click the topic panel and choose '''Toggle animation'''. To antialias the graph select '''Antialias graph'''. Antialiasing slows down the graph drawing.
+The graph topic panel is not a default visualization in Wandora and the user has add the graph topic panel into the Wandora. A graph topic panel is added to the Wandora by selecting a menu option '''View > New panel > Graph'''. The user may add several independent graph topic panels into the Wandora.
-Usually graph becomes very dense if you open hundreds of nodes. You can filter out undesired edges with edge context menu option '''Filter associations > Filter edges of type X''' where X is association type of current edge. Selecting '''Clear association filters''' clears all edge filters. However, Wandora doesn't view previously filtered edges automatically but user must expand nodes again to make edges visible.
+== Editing topics in the graph ==
-Left edge of Graph panel contains mouse mode buttons. Mouse mode defines how Wandora interprets mouse clicks, movements, and drags. Available mouse modes are:
+The graph topic panel doesn't allow the user to edit topic's internals. To edit topic's internal structures you need to change topic panel to [[Traditional topic panel|Traditional]] or [[Tabbed topic panel]]. However, the graph topic panel allows the user to apply topic editing options to a set of node selection. These topic editing options locate in the context menu, below menu option '''Topics'''. For example, context menu option '''Topics > Base names > Modify base names with a regex''' applies given regular expression into the topic in selection and possibly alters base names.
+See chapter ''Mouse modes'' below to get familiar with the association drawing.
+== Force-directed graph ==
+The graph is [http://en.wikipedia.org/wiki/Force-directed_graph_drawing force-directed] i.e. nodes are assigned forces based on their positions, and these forces have an effect to the motion of the nodes.
+Thus, the graph is animated and node positions change automaically. As the time passes, the graph gets usually clearer and finds a balance. However, some times when nodes have very much edges, the graph may end up animating very rapidly and the animation looks like a random mess. In this case it is good to stop the animation and filter out some edges.
+== Moving and zooming the graph ==
+The user can zoom in and out the graph. To zoom the graph, user should use the mouse wheel or the magnifier button widget in the buttonbar to the left of the graph.
+To center the graph, the user can select context menu option '''Center graph''' or click Center current topic node button. If you have closed or filtered the current topic node, centering doesn't work.
+To move the complete graph the user should have the mouse move mode activated, and drag the graph background with the mouse. To rotate the graph the user should keep SHIFT key pressed while dragging the graph background woth the mouse.
+To move single node the user should have the mouse move mode activated, and drag the node rectangle. As the graph is force-directed, moving a node may drag other nodes into other positions.
+See chapter ''Mouse modes'' below.
+== Expanding the graph ==
+A fresh graph topic panel views a topic with it's immediate topic neighbours in the panel. The user can expand the graph either by expanding graph nodes and by sending topics to the graph.
+A graph node is extended by right mouse clicking it and choosing a context menu option '''Expand node'''.
+A topic is sent to a graph with a topic context menu option '''Open topic in > Graph w ...'''. Topic context menu options '''Open topic in''' can be found in many places in the application, in the topic tree, for example.
+To expand nodes recursively the user can choose a context menu option '''Expand nodes recursively'''. To make recursive expansion, the user must enter a recursion depth. Recursion depth is a positive integer number usually bigger that 1.
+A graph node is closed by selecting the menu option '''Close nodes''' in context of the node. Closed nodes can be opened again.
+To close all nodes but the current, the user can choose context menu option '''Close all nodes but'''.
+== Hyperbolic projection and projection curvature ==
+The graph topic panel views the graph in a 2D-hyperbolic projection. Hyperbolic projection views nodes in the center bigger. The user can change the strength of the hyperbolic perpective. The strength, or curvature, is changed by rolling the mouse wheel while the SHIFT key is pressed down. Also, the curve widget button can be used to change the hyperbolic strength. If the hyperbolic strength, curvature, is large enough, Wandora views a graph horizon, a grey circle around the graph. No node and no edge can ever cross the graph horizon.
+Next two images view same graph with two different projection curvatures. Projection curvature of the first graph is 84 while the projection curvature of latter graph is 1. The grey circle around the first graph is the graph horizon. The user should notice that the projection of latter graph is nearly a plane projection.
+[[File:graph_topic_panel_hyperbolic_01.gif|center]]
+[[File:graph_topic_panel_hyperbolic_02.gif|center]]
+== Animation and framerate ==
+The graph is animated by default. To stop the graph animation, the user can right click the topic panel and choose context menu option '''Toggle animation'''. Choosing the menu option while the animation is stopped, starts the animation.
+Animation framerate is 25 frames per socond by default. ''Real'' framerate is viewed at the bottom right corner of the graph topic panel. User's computer and the graph size sets limits to the ''real'' framerate.
+Sometimes while viewing a large graph it may be handy to lower the framerate of the graph topic panel. Framerate is changed with the '''fps''' button widget on the right side of the panel. Framerate also affects the responsivity of user interactions. Thus, with a small framerate, moving the graph feels like a stop motion animation.
+== Pinning nodes ==
+The graph is animated by default. Sometimes the user may want to lock the position of some nodes while the rest of the graph is still animated. This position locking is called pinning. To pin a node the user can right mouse click over a node, and choose menu option '''Pin nodes > Set selection pinned'''. A pinned node has an emphasized black edge.
+To release pinning of a single node the user should select menu option '''Pin nodes > Set selection unpinned'''.
+To pin all nodes the user should select menu option '''Pin nodes > Set all pinned'''. To release all pinned nodes the user should select menu option '''Pin nodes > Set all unpinned'''. To reverse the pinning status of all nodes the user can select menu option '''Pin nodes > Reverse pinning'''.
+== Filtering nodes and edges ==
+Usually the graph becomes very dense if the user open hundreds of nodes. The user can filter out unwanted nodes with context menu options below '''Filter nodes''' and unwanted edges with context menu options below '''Filter edges'''.
+To release filtered nodes the user can choose menu option '''Clear all node filters'''. Similarly, all edge filters are released by choosing a menu option '''Clear all edge filters'''. To release a specific filter, the user should use menu options below '''Release node filters''' and '''Release edge filters'''.
+The user can select to view filter status top right corner of the graph topic panel by choosing a context menu option '''Options > View filter info'''. Choosing the menu option again hides filter status text.
+== Mouse modes ==
+On the left side of the graph panel locates mouse mode buttons. A mouse mode defines how the graph topic panel interprets mouse clicks, mouse movements, and mouse drags. Available mouse modes are:
 * Move mode
@@ Line 19: / Line 90: @@
 === [[Image:hand_on.png]] Move mode ===
-While move mode is active, mouse moves graph and nodes.
+While the move mode is active, the mouse moves the graph and the graph nodes.
-To drag the graph, press left mouse button on panel background, keep the mouse button down and move mouse.
+To drag the graph, press left mouse button on the panel background, keep the mouse button down and move the mouse.
-To rotate the graph, keep SHIFT key pressed while dragging the mouse over panel background. Graph is rotated around the current topic node.
+To rotate the graph, keep SHIFT key pressed while dragging the mouse over the panel background. The graph is rotated around the current node.
-To move single topic node, press left mouse button on topic node, keep the mouse button down and move mouse. Note that node may change it's position after mouse button release as nodes have their own dynamics.
+To move a single topic node, press left mouse button over a node, keep the mouse button down and move the mouse. Notice, the node may change it's position after you have eleased the mouse button as the graph has it's own dynamics.
-To lock node position on graph, select '''Pin nodes > Set selection pinned''' in node context menu. To release pinned node select '''Pin nodes > Set selection unpinned'''. Pinning and unpinning is not restricted to move mode but works in any mode.
+To lock a position of a node on graph, select context menu option '''Pin nodes > Set selection pinned''' over the node. To release a pinned node, select context menu option '''Pin nodes > Set selection unpinned'''. Pinning and unpinning nodes works in all mouse modes.
 === [[Image:lasso_on.png]] Select mode ===
-Select mode enables the user to draw closed paths on graph panel. Wandora selects topics within the closed curve. Selected nodes are colored gray-blue.
+The select mouse mode enables the user to draw closed paths on the graph panel. The graph panel selects nodes within the closed curve. Selected nodes are colored gray-blue.
-To select single nodes user can also click on the node. Previous selection is cleared unless the user holds SHIFT key pressed while clicking on the node.
+To select single node the user can also click on the node. Previous selection is cleared unless the user holds the SHIFT key pressed while clicking on the node.
-To select nodes according to topic's type or internal structure user can also use selection tools found in '''Select''' menu. Available selection tools allow the user to select topics without classes or instances for example. Select menu is available regardless the chosen mouse mode.
+To select nodes of certain type or with certain property, the user can use selection tools found in the '''Select''' menu. Available selection tools allow the user to select topics without classes or instances, for example. The select menu is available in all mouse modes.
 === [[Image:pen_on.png]] Association mode ===
-While association mode is active mouse behavior resembles move mode except that clicking left mouse button on node activates '''Draw association'''. To draw association press left mouse button on a topic node and drag mouse over another topic node. A line is drawn from source node to mouse pointer during drag. When you release the mouse button over a node, association editor is viewed. By default the association editor has pointed topics as association players. To create a valid association you need to choose association type and roles.
+While the association mouse mode is active, the mouse behavior resembles move mouse mode except that clicking left mouse button over a node activates '''Draw association'''. To draw an association the user should press left mouse button over a topic node and drag the mouse over another topic node. A line is drawn from the source node to the mouse pointer during drag. When the user releases the mouse button over a node, an association editor is viewed. By default the association editor views addressed topics as association players. To create a valid association the user should choose association type and roles, and confirm association creation.
+== Exporting the graph ==
+To export the graph the user can select context menu options under '''Export graph as'''. Context menu is revealed by right mouse clicking the graph.
+Available export formats are DOT, GraphML, GraphXML and GML.
+Only visible nodes and edges are exported.
-[[Image:Graph_topic_panel_example.gif|center]]
+The user should not mix these '''Export graph as''' options with options that locate under '''Topics > Export'''. Latter options sees the graph as a topic collection and exports ''topics''.
+To copy the graph as an image to the system clipboard the user can use context menu option '''Copy as image'''. The user can then paste the image to a word processor, for example.
 == See also ==
@@ Line 53: / Line 132: @@
 * [[R topic panel]]
 * [[Processing topic panel]]
+* [[Sketch grid]]
+* [[Webview]]
+* [[Tree panel]]
+* [[Search panel]]
+* [[Layer info panel]]
-__NOTOC__
+Beside the graph topic panel, Wandora features an embedded server with a [[D3 graph service module]] that implements an alternative graph visualization.