Graphical User Interface
We suggest to run Tulip and experiment with the concepts explained while reading this Manual. Here are the components of the main window:

Menus
File: usual file operations (New, Open, Save, Save as, Close Tab, Exit) and
Import: when import plugins are installed, they go into this menu.
File: import graphs in various file formats, such as Adjacency Matrix (see Wikipedia: Adjacency Matrix for details), GML (used by the graphlet system, a toolkit for graph editors and graph algorithms), dot (graphviz), or TLP (Tulip's own file format).
Graph: plugins to generate graphs (random or deterministic):
Complete General Graph: complete graph
Complete Tree
Grid: 2D grid
Grid approximation: This algorithm creates the specified number of nodes and places them randomly in the 2D plane. Then it adds an edge between all pairs of nodes that are at distance at most d. d is adjusted so that the average degree is approximately the degree requested.
Random General Graph
Random Simple Graph
Uniform Random Binary Tree
Misc: plugins to capture the tree structure of a file system directory under a selected root, or crawl the graph structure of a web site.
Export. save a graph in GML or TLP formats. Plugins can be installed to support more file formats.
Edit:
Cut
Copy
Paste. Note that a copied element is placed at the location of the original; use right-click View → Center View or Ctrl+Shift+C if the pasted element is outside of the screen
as well as modify the selection:
Find . This tool has 4 options:
Replace: Replace the current selection (nodes or edges already selected).
Add: Add the nodes (or edges) to be selected to the current selection.
Remove: Remove nodes (or edges) from the current selection.
Intersect: Select the intersection between the nodes (or edges) TO BE selected, and the ones from the current selection.
Select All ,
Delete selection: delete selected nodes and edges,
Deselect all ,
Invert Selection .
This menu also contains Create group, Create subgraph, Undo, Redo.
Algorithm:
Selection: select nodes and/or edges based on advanced criteria. (Selecting means assigning the 'viewSelection' property, see for details). For example, the 'Loop Selection' algorithm detects all edges for which the starting and ending nodes are the same.
Color: computes the color (the 'viewColor' property, see for details) of the graph elements. A default one, 'Metric Mapping', is provided; it allows to color all graph elements according to a metric property.
Measure: compute and assign a value to the 'viewMetric' property of graph elements, see for details. For example, when running the 'Degree' algorithm, the degree (the number of neighbors) is computed and stored, for each node, into its 'viewMetric' property.
Layout: compute the position of each node. For example, the 'Circular' algorithm places all nodes along a circle.
Before:
After:
Size: compute a size (the 'viewSize' property see for details) of the graph elements.
General: more general algorithms: subgraphs, quotient graphs, groups... For example the 'Equal Value' algorithm create subgraphs for which the elements have a chosen value for a chosen 'metric' property.
For more information, see .
Graph :
Tests: test if the graph obey some constraints:
Simple : Is the Graph Simple? As opposed to a multigraph, a simple graph is an undirected graph that has no loops and no more than one edge between any two different vertices. For more information, please visit: Wikipedia: Simple graphs
Directed Tree : A directed tree is a directed graph which would be a tree if the directions on the edges were ignored. Some authors restrict the term to the case where all edges are directed towards a particular vertex, or all away from a particular vertex. More information: Wikipedia: Directed Tree
Free Tree: A tree without any designated root is called a free tree. More information: Wikipedia: Free tree
Acyclic: A graph is acyclic iff it contains no cycle. (A cycle is a path having the same start and and nodes.) More information: Wikipedia: Acyclic graphs
Connected: A graph is connected iff there is path path from any node to any other node. More information:
Wikipedia: Connectivity
Bi-connected : A connected graph is biconnected if the removal of any single node (and its adjacent edges) does not disconnect the graph. More information:Wikipedia: Biconnected Graphs
Tri-connected : If it is always possible to establish a path from any node to an other one even after removing any 2 nodes, then the graph is said to be tri-connected. More information: Wikipedia: k-connected graphs
Planar : A graph is said to be planar if it can be drawn on the (Euclidean) plane without any edges crossing. More information: Wikipedia: Planar Graphs
Outer Planar : A graph is said to be outer planar if it has an embedding in the plane such that its nodes lie on a fixed circle and its edges lie inside the disk without any crossing. More information: Wikipedia: Outerplanar Graphs
Modify : Modify the whole structure of a graph, to ensure the graph has one of the above properties:
Make Simple : Makes the graph simple (by removing self loops and parallel edges, if any). see Algorithm documentation
Make Acyclic Makes the graph acyclic (by replacing each loop with a triangle, then reversing some edges).
Make Connected If the graph is not connected, adds edges to make the graph connected.
Make Bi-connected If the graph is not biconnected, adds edges to make the graph biconnected.
Make directed : If the graph is a free tree, make it directed. If only one node is selected, this one will be considered as the root node. If none is selected, Tulip will heuristically choose the center of the graph as the root node. More information: Wikipedia: Directed Tree
Reverse selected edges: Exchange source and target of those edges.
View: click one and a new subwindow will be created in the view window. For instance, table view displays the list of nodes and the list of edges. See Standard views.
Windows: manages the subwindows of the view window.
Options: enable/disable the display options, and show the Graph or View editor:
Display options:
Force ratio: Tries to keep a good Height/Width ratio for the graph layout.
Map metric: Whenever a measure algorithm is run, show its result by updating the graph colors (i.e. applies the Color / Metric Mapping algorithm)
Morphing: when a new layout is applied, displays an animation morphing the old layout to the new one.
Show Graph/View editor: if you have closed the Graph or View editor tab (in the left dock widget), you can show it again thanks to this menu
Help: Documentation (the present one), Preferences, Plugins manager, About this software, including version number.

Toolbar
The toolbar contains 6 tools:
Open file: Open a new graph.
Save file: Save the current graph.
Print: Print the current graph.
Undo: Undo the last operation on the graph.
Redo: Redo the last undo operation.
Snapshot: Record an image of the current view.

Graph Editor
This subwindow is divided into three tabs: Property, Element, Hierarchy.

Property
This tab displays the properties of nodes and edges as a table. (Properties will be covered in .) This tab can also be acessed by clicking the tool, then clicking on a graph element (node or edge).
It is composed of two parts: click on the bottom one to choose which property to display in the top one. Check selected only to restrict the table to the nodes selected in the node link diagram (i.e. the drawing). Right-click (Ctrl-click on Mac) on a table row to display this pop-up menu about the corresponding element:
Add to/Remove from selection: change the selection state of the element,
Select: the current element replaces the whole selection,
Delete: permanently remove the element from the current graph,
Properties: show the element properties in the Element tab (which we now explain).

Element
Click this button in the toolbar , then click an element (node or edge). The element tab opens: Like before, double-click a cell (in the value column) to update it.

Hierarchy
This tab shows the hierarchy, i.e. the inclusions between the subgraphs and groups of the current graph. Hierarchies will be explained in . A hierarchy is often the result of a clustering algorithm. Right-click an element to remove, clone or rename it.

View Editor
Click the "View editor" tab at the bottom left corner to access this subwindow. Here one can configure the interactor (see picture below) and the view. Thus, when the type of active view changes, this window also changes. For example, when the view is the Node Link Diagram (i.e. a drawing), there is a tab with Rendering parameters (like on the picture below), but when the view is the Table view, there is no need for a rotation interactor!

Standard views

Node Link Diagram view
This is the most intuitive view: it draws the graph.

Mouse Interaction Toolbar
Buttons to act on the graph with the mouse.
3D Navigation: move, rotate and zoom the view. Zooming behavior: the point under the cursor is moved closer to the center.
Get Information: click an element (node or edge) and Tulip displays all available properties of that element.
Rectangle Selection: select all elements intersecting the selection box (the previous selection is replaced, but can be recovered with Undo). With Shift, the newly selected elements are added to the current selection; with Ctrl (Alt on Mac), the selected elements are removed from the current selection.
Selection edition: modify the shape and position. Shift-click modifies only coordinates. Ctrl-click modifies only size. Left-click outside the selection resets the selection.
Click inside the selection to translate it.
The circle rotates the selection.
The triangle streches (horizontally or vertically) the selection.
The square does the same as triangles, but in both directions.
Align the selected nodes:
align vertically on center
align horizontally on center
align vertically on the right side
align vertically on the left side
align horizontally on the bottom side
align horizontally on the top side
Magic Selection: selects all the nodes having the same metric and connected to the clicked node. Thus, it works like the magic selection in image editing software, but consider neighboring nodes instead of neighboring pixels.
Zoom on Rectangle: Zooms on a specified rectangle area. mouse left down indicates the first corner, mouse left up indicates the opposite corner.
Delete element: click a node or edge to delete it.
Add node: click to add a node at the mouse position.
Add edge: to add an edge, click the source node, optionally click outside of nodes to add bends, finally click the target node. When not tracing a link, click outside of nodes to add a node.
Edit edge bends: click on an edge to select it (with this tool), then Shift-click to add a new bend, click a bend to move it, or Ctrl-click (Alt on Mac) to remove a bend.

View window
This is where the graph is drawn, in 2D or 3D. Several 3D views can be displayed, each one in a subwindow. Here is an example graph with 9 nodes:

Context menu
Right-click (Ctrl-click Mac) to display this menu:
View: Redraw view, Center view.
Dialog:
3D Overview: toggle top left overview
Augmented Display
Options:
Tooltips: toggle the display of tooltips when hovering nodes or edges
Grid: shows the grid configuration dialog.
Z Ordering: Use this option when you have graph with transparent nodes or edges.
Antialiasing: toggle antialiasing.
Textured meta node: toggle meta node texture rendering.
Right-click a graph element to display this menu: If the element is a metanode, the following extra entries are available:
Go inside: shows the corresponding subgraph in the current view,
Ungroup: removes the metanode (the nodes of its subgraph are kept in the current graph),

Rendering Parameters
Actions in this dialog are aplied only on the current view window.
Labels:
metric ordering: if checked, labels are displayed in decreasing order of the selected property (default is viewMetric).
Density: move this slider to the left to have less labels displayed.
Scale labels to fit node size
Edges:
Color interpolation: if checked, the edge color is a gradient from the color of its source node to the color of its target node.
Size interpolation: like color interpolation, but for edge width.
Block max edge size to node size: if checked, the edge size cannot be greater than the node size.
Others:
Orthogonal projection: If not checked, the perspective projection is used instead of the orthogonal one.
Selection color: how to show that a node is selected. Click "Save at default" to apply this selection color to new views.

Layer Manager
Actions in this dialog are aplied only on the current view window.
Visible: should the element be displayed?
Stencil: priority to display the entity
If the visibility checkbox next to Hull is clicked, the convex hull of each subgraph is computed.

Table view
In this view you can visualize and edit the values of each graph elements (nodes or edges) using a table form. Each column represents a graph property and each row a node or an edge.
The picture beside a property mean that property is inherited.
Nodes and edges are drawn in different tables. To switch the current table click on the Nodes or the Edges tab at the top of the view.
To edit a value double click on the corresponding cell. Once the modification done press the Enter key to commit the modification or Escape to cancel it.

Sort elements
To sort elements click on the label of the property. To invert the sort order click again on the label of the property.

Contextual menu
There is three kinds of contextual menu :
Property menu
Nodes menu
Edges menu

Property menu
Right click on the label of a property to show it's contextual menu.
Hide: hide the property in the table. To show it again use the property management panel.
Create new property: display the property creation dialog. Choose a property type and input a property name then click on Ok.
Copy to: display the property copy dialog. In this dialog you can choose to copy the property in a new property or in an existing property.
Set all values: set the value of each element of the table. If a filter is defined update only displayed elements.
Reset: reset properties values to default value. Do not take in account filter.
Delete: delete the property. You cannot delete inherited properties.

Nodes menu
Right click on the label of a node or on a row in the table to show the contextual menu.
Select: replace the nodes selected in the graph by the nodes highlighted in the table.
Add to the graph selection: add the nodes highlighted in the table to the graph selection. Do not clear the old selection.
Remove from the graph selection: remove the nodes highlighted in the table from the graph selection.
Highlight selection: highlight in the table the nodes selected in the graph. Clear previously highlighted nodes.
Clone: duplicate highlighted nodes in the table. Also copy the properties values.
Group: create a meta node with the highlighted nodes. This action is available if more than one node is highlighted
Ungroup: extract all the nodes in the highlighted metanodes. Metanodes will be deleted. This action is available if all highlighted nodes are metanodes.
Delete: remove highlighted nodes from the current graph.

Edges menu
Right click on the label of an edge or on a row in the table to show the contextual menu.
Select: replace the edges selected in the graph by the edges highlighted in the table.
Add to the graph selection: add the edges highlighted in the table to the graph selection. Do not clear the old selection.
Remove from the graph selection: remove the edges highlighted in the table from the graph selection.
Highlight selection: highlight in the table the edges selected in the graph. Clear previously highlighted edges.
Delete: remove highlighted edges from the current graph.

Properties management panel
To show the property management panel click on the Properties button at the top left corner of the view.
Each table has it's own property management panel, so displayed properties can be different in nodes table and in edges table.

Displayed properties widget
This widget allows the user to show and hide properties in the table. Check or uncheck the check-box beside a property to show or hide it.
A right click on the list display a contextual menu :
Show: show the highlighted properties. Do not hide previously displayed properties.
Show selected only: show the highlighted properties and hide all the other.
Hide: hide the highlighted properties.
Create new property: display the property creation dialog. Choose a property type and input a property name then click on Ok.
Copy to: display the property copy dialog. In this dialog you can choose to copy the property in a new property or in an existing property.
Delete: delete the property. You cannot delete inherited properties.

Filter displayed properties
This widget allow the user to select group of properties.
The Visual properties button selects all the properties that affect visual rendering.
The Data properties button selects all the properties containing user data i.e. properties created by the user, an algorithm or properties imported from a CSV file.
The Custom filter field allow the user to filter displayed properties using a regular expression. Each property with a name matching the pattern will be displayed.

Filter data
This widget allow the user to filter displayed elements in the current table.
The Show only selected elements check-box hide all the elements that are not selected in the graph.
To filter elements using regular expression : input a pattern in the Search filed, choose to search in a specific property or in all the properties and click on the Filter button.