3. Properties of graph
Prev | Chapter 3. Functionalities | Next

## 3. Properties of graph

In Tulip, there is a way to assign properties to each node or edge of the graph. Tulip defines two kinds of property : intrinsic and extrinsic. The first represents the properties computed relatively to the structure of graphs. But it is possible to assign values to the nodes or the edges that are not related to the structure. For example, if we build the map of a region and the nodes represent the towns, the label property can be used for the name of town. But it is not possible to determine the name with the structure of the graph; this kind of property is extrinsic.

For each graph, Tulip provides a set of properties used by the renderer engine ; all begin with the “view” prefix by convention : viewColor, viewLabel, viewLayout... They are updated during the computation phase of the plugins. In the other hand, it is possible to define properties to store informations relative to the graph. The number of this created properties are not limited.

### Rendering Properties

Following is the list of rendering properties :

- `viewBorderColor :` Color of the border of an edge or a node.

- `viewBorderWidth :` Width of the border of an edge or a node.

- `viewColor :` Color of an edge or a node.

- `viewFont :` Font path used to render label of an edge or a node.

- `viewFontSize :` font size used to render label of an edge or a node.

- `viewLabel :` Label of an edge or a node.

- `viewLabelColor :` Color label of an edge or a node.

- `viewLabelPosition :` Label position (x,y,z) of an edge or a node.

- `viewLayout :` Position (x,y,z) of a node, or vector of the bends positions of the edges.

- `viewMetric :` Result value of the last measure ( the section called “Measure” ) algorithm applied.

- `viewRotation :` Rotation (0 to 360) of a node or an edge

- `viewSelection :` Selection equals true if the node or edge is selected. False if it is not.

- `viewShape :` Shape of a node or a graph.

- `viewSize :` Size (height, width, depth) of a node or an edge. To re-size an edge, the parameter "Size Interpolation" (CONTROL+R) must be switched off. For an edge, the three fields are : Width at source of the edge, Width at the end of the edge, Size of the arrow.

- `viewSrcAnchorShape :` Shape of the source anchor of an egde.

- `viewSrcAnchorShape :` Size of the source anchor of an egde.

- `viewTexture :` Texture will replace the color background of the node.

- `viewTgtAnchorShape :` Shape of the target anchor of an egde.

- `viewTgtAnchorShape :` Size of the target anchor of an egde.

### Using Properties

#### Updates of property values

As it is explained in the last section, it is possible to update the properties attached to the graph elements with algorithms. An other solution is to update the values through the `Property` tab of the `Info Editor` subwindow.

To give an example, create a graph :

- Select the property you want to update, `viewSize` in the `local` table, for example, to manage the size of the nodes. Now, you can change all values or the value of one node.

  1. Click on `Set all`, and write the new coordinates : `(2.0, 2.0, 2.0)`

  2. Click on the line and the second column of the choosed node in the table. Change the values for the `width`, the `height` and `depth`.

If you want to change properties of selected elements, use the check box `selected only` of the `Property` tab.

- Select elements with the mouse toolbar operation or using the 'Add/Remove Selection' item displayed in the contextual pop-up menu which appears when pressing on the mouse right button (press Ctrl key when mouse pressing on Mac).

- Select the property you want to modify : `viewLabel`.

- Click on the checkbox named `Filter`. The selected element just appears in the table above.

- Click on `Set all` and write the text you want to display : “Hey!”.

If you uncheck `selected only`, all nodes are in the table. It is possible to do the same thing with the values of edges. You just have to click on the tab named `Edges`. There is an other solution to modify the value of one node or edge :

- First select the mouse toolbar operation, then click on the node or edge you want to update.

- The `Element` tab of the `Info Editor` subwindow is then selected. It displays the informations of the element you clicked on.

#### Management of properties

The bottom of the `Property` subwindow enables to manage the properties. For each graph, as explain before, a set of display properties already exists. If you want to create a new property :

- Click on the `New` button.

- Select the type of property, `String`. (other possibilities are Color, Integer, Layout, Metric, Size, Selection)

- Type the name of the new Property (e.g. `mylabel`).

For removing a property, you just have to select the property and click on the button named `Remove`. When deleting properties used by the render engine, those properties will be temporary removed from the list but still continue to exist. Note that it is not possible to remove `inherited` properties.

For importing properties from CSV files click on the `Import CSV Data`. A widget will appear to help user import data in the current graph see ???.

The last feature is cloning property. Select the desired property and click on the button named `Clone`. Type the name you have chosen. The new property keeps the values.

#### Import properties from CSV file.

With this functionnality user can easily import properties from CSV files into graph. A widget helps user import data during the process by giving a preview of the result. Data will be loaded on nodes until there is no more data or all the nodes have bee processed (in this case the excess of data will be lost).

If you want to import properties :

- Select the CSV file name with the `CSV file` text field.

- Choose the separator used in the file with the `Separator` text field.

- Set if the first row/column is used as properties name with the `Use first row as property name` check box.

- Choose if the data are row arranged with the `Use column as properties` radio button or column arranged with the `Use row as properties` radio button `Use first row as property name` check box.

- For each properties detected you can select or unselect it, change it's name and set this data type :

  - To select or unselect a property just check or uncheck the check box before its name. Each unchecked property wont be load.

  - To change the name of the property edit the text field. Each property must have a unique name.

  - To change the data type of the property change the value in the combo box below its name. By default the type is auto detected, but if user know the data type of the properties he can choose the right in the combo box. Auto detected data types are only three types : integer, double or string.

- Launch the import process by clicking on the `Ok` button or cancel it by clicking on the `Cancel` button.

#### Find : make a request.

The find tool is in the `Edit` menu. Make a graph with several nodes. Change some properties of node for making operations. Select nodes, check the `Filter` box and select the properties you want to change : `viewRotation`. Click on the `Set all` button and type a value (`20` for example). Now, you have some node with a rotation of 0 degree and some other rotated of 20. So in the Find box :

- Select the property used for the request : `viewRotation`.

- Choose the operation and type a value for the comparaisons : `=` and `20`, to find the element rotated of 20 degrees.

- Select the action in the `Options` part : `Add` and the kind of the elements of the request : `on nodes`.

Prev | Up | Next
2. Algorithms | Home | 4. Hierarchy