Using the Dashboard

What's on the Dashboard?

After a succesful login, you see the standard dashboard.

Dashboard

On the left side, in an area thah is called sidebar-left you see:

  • a Logo panel, that also displays the InterActor version.
  • a User panel, with your username, a [Log off] button and a standard set of shortcuts. These shortcuts provide access to basic functions.
  • a Cypher panel, that allows you to execute cypher statements against your Neo4j graph store. A default Cypher statement is provided.

The central part, the content area, is empty for now. In this area most of the action will take place.

In the sidebar-right, you see:

  • a KeysView panel in which property key-value pairs will of the active node or relation be displayed.
  • a Neighbours panel that provides access to neighbours of the active node. It provides information on the type of relations, and allows you to browse the graph in a controlled way.
  • a History panel that can display a Node or Cypher History. The Node History provides access to your trail of active nodes, the Cypher History provides access to your trail of Cypher statements executed in the Cypher panel.

Back to top

Go browse!

For your first run, verify that our default Cypher statement

MATCH (n)-[r]->(m) RETURN n,m LIMIT 10

is in the Cypher panel and click on the [Execute] button in the Cypher panel.

Default cypher

The statement is executed and the result is displayed in a NetworkView.

When you click on a node or relation, its property keys and values appear in the KeysView panel. In addition, you see some metadata, like the id, node labels or relatiuon type, and the name of the Neo4j store.

When you have clicked on a node, two other actions are triggered:

  • the Neighbours panel is updated with a list of neighbouring nodes, grouped by type of relation.
  • the node you clicked is added to the trail of active nodes in the History panel.

Now close the NetwworkView and select one of the items of the trail in the History panel. The nodes becomes the active node and the KeysView panel and Neighbours panel are updated.

You can also click one of the sub-items in the Neighbours panel to make it the active node.

To send the active node to a NetworkView, click the [to new NetworkView] button in the KeysView panel.

The standard way of exploring is by double-clicking on nodes. When you do this on a so-called dense node though, the result may not be particular useful. Controlled exploration, as explained below, may be more appropriate.

Back to top

Select nodes and relations

Nodes and relations in a NetworkView are (un)-selected by clicking on them.

You can (un-)select multiple nodes by keeping the <Shift>-key pressed while clicking.

Back to top

Controlled exploration

InterActor offers several ways to keep control over your exploration. You can of course double-click on a node and see your screen all of a sudden filled with many nodes, but in most cases it is more useful to orientate you exploration in a specific direction. Or to limit the number of nodes and relations that is displayed.

Load specific neighbours

The Neighbours panel in the sidebar-right contains the list of neighbours of the active node, grouped by the type of neighbour (based on node label) and relation type. The group header also display the number of neighbours in the group.

Neighbours panel

By clicking the [+ ##] next to the group header or the **[+]]++ nect to the neighbour name you can add them to the current NetworkView.

Filter the content of the NetworkView

With the [Filter] button in the toolbar of the NetworkView, you can open a filter panel in which you can automatically load selectors for all node-labels and relation types in the current view. By (de-)selecting them you can limit the types of nodes and relations that are visible.

Filter View

Filtered exploration *

With the [Binoculars] button in the toolbar of the NetworkView, you can open a panel in which you can set which relation types will be loaded when you double click a node. The context is determined by the current set of visible nodes, and is updated automatically when the content of the NetworkView changes.

Filtered exploration

With the [Show] button, you can load all corresponding nodes.

Remove specific nodes from view

The context menu of the NetweorkView canvas (right-click on an empty space) has an option "Remove selected nodes from view".

Removing nodes from view

The nodes will disappear from view, but not from the graph store.

Back to top

Store and retrieve Diagrams

A InterActor Diagram is a set of nodes in a frozen lay-out.

You can save any view to a diagram by selecting the [Disk] button and providing a unique name for your Diagram.

Store Diagram

Diagrams are stored as data in the Neo4j graph store, as a (:IA_Diagram)-[:CONTAINS {x:,y:})->(n) structure.

To retrieve a diagram, click on the My Diagrams shortcut in the User panel and select a diagram.

Retrieve Diagram

Back to top

Manage nodes and relations

In addition to using Cypher statements to manage nodes and relations, which would be the same as you would do it in the standard Neo4j browser, InterActor allows you to manage nodes and relations in a different way.

Create nodes

If there's now open NetworkView, open a new NetworkView using the [New NetworkView] shortcut in the User panel.

Right-click on the canvas of the NetworkView and select "Create Node".

Provide node labels and property-keys and values and click the [Save] button. The new node is added to the NetworkView.

Create node

Create node

If you don't like the nodes to float around , switch off the auto-layout status by clicking the [Pin] button. New nodes will be then be appear at the position on the canvas from whcih you opened the context menu.

Clone nodes *

InterActor Enterprise Edition offers the option to create clones from exitsing nodes.

Richt-click on a node and select "Clone". A form appears, pre-filled with labels, property keys and values.

Create relations

You can create relations as follows:

  • Select the start node
  • Select the end node with the <Ctrl> key (Windows/Linux) or <Cmd> key (Mac OS)

A form in which you can set the relation type and its property keys and values appears. Upon [Save] the relation appwars in the NetworkView.

Create relation

Create relation

Edit nodes and relations

You can edit nodes and relations by opening the context menu and select the "Edit" option. With [Save] the changes are written to the Neo4j graph store.

You can also click on a node or relation to make it active and then click the [Edit] button in the KeysView panel.

Delete nodes and relations

You can delete nodes and relations by opening the context menu and select the "Delete" option. After confirmation, the node or relation is deleted.

Nodes are deleted using DETACH DELETE n, so you can delete nodes that have relations.

Back to top

Style nodes and relations

Nodes and relations can be styled using the My Styles UserStylesView that is accessible from the shortcut in the User panel.

When the UserStylesView is opened, it automatically displays all styles that are used for the all nodes in the active NetworkView(s).

Node and relation styles are applied in a cascading manner. To view which styles are applied for a specific type of node or relation, switch to the "Generated" tab, and hover over a node.

Cascading style

The computed styling of :IA_NetworkView node in the image is derived of three styles: node:, node:IA_Function and node:IA_NetworkView, because these three styles match have selectors that match with the :IA_NetworkView node. After all, it is a node, and it has, besides the IA_NetworkView label, also a IA_Function label.

If you now click the node in the UserSylesView, the three relevant styles appear in a list. Each of them has a styling definition in JSON format.

Cascading style

The styles are applied in the order that they appear in the list and have the following settings.

For nodes:

{
	"display": "circle",                              // circle|square|rectangle|triangle
	"width": 60,                                      // in pixels
	"height": 80,                                     // in pixels
	"fillColor": "white",                             // html colour
	"opacity": "1",                                   // 0 - 1
	"lineColor": "black",                             // html colour
	"lineWidth": "2px",        
	"lineOpacity": "1",                               // 0 - 1
	"label": "(%).properties.name",                   // caption, e.g. (%).id or (%).properties.name
	"labelPosition": "center",                        // top|left|bottom|right|center
	"iconColor": "black",                             // html colour (not IN CE)
	"iconClass": "fa fa-female"                       // font awesome class, e.g. fa fa-female  (not IN CE)
   	"image": "(%).properties.file",                   // image as node background
	"labelStyle": {                                   // caption styling
		"font": "25px Open Sans Condensed, sans-serif",
		"fontWeight": "5",
		"color": "black"
	}
}

For relations:

{
	"fillColor": "#999",                              // html colour
	"width": 4,                                       // width in pixels
	"label": "(%).type",                              // caption, e.g. (%).type or  (%).properties.weight
	"marker": {                                       // marker styling
		"display": "arrow",
		"width": 10,
		"lineWidth": 1,
		"color": "grey",
		"fillColor": "grey"
	},
	"labelStyle": {                                   // caption styling
		"font": "15px Verdana",
		"fontWeight": "0.1px",
		"color": "black"
	}
}

The full lists of available selectors for nodes and relations are accessible via the Edit tab.

You can add your own selectors, for which you can define your own styles. Some examples:

Selector Description
node: applies to any node
node:MyLabel applies to any node with a :MyLabel label
node[myParam] applies to any node with a .myParam property
node:MyLabel[myParam>5] applies to any node with a :MyLabel label and for which the .myParam property value is greater than 5.
rel: applies to any relation
rel:MYRELTYPE applies to any relation of type :MYRELTYPE

You can move the selectors up and down to influence the order in which the styles are applied.

To save the styles, click [Save].

Back to top

Use multiple NetworkViews

Multiple NetworkViews can be very useful if you need to look at different subgraphs, or if you want to create relations between nodes from nodes that are far away from each other.

The NetworkView comes with built-in option to insert nodes that have a state "selected" in other NetworkView. You find this option in the canvas context menu. Use this option to bring nodes together in a single NetworkView and create new relations in there.

Multiple NetworkViews

Back to top

Multiple dashboards *

When you have multiple dashboards, a selector is displayed that allows you to load a specific dashboard.

Dashboard setup

Back to top

  • not available in Community Edition