Navigation allows the use of mouse and keyboard. You may also create shortcuts. Node's menu allows controlling the physics of the environment and provides backup, share and clone functions.

Accessing the Design Space

Use the control in the center of the turquoise bar to pull the slider up and down to make more room for either space.

The dark side of the web application is the design space. Pull the slider up to find the charting space.

You may also use the keyboard as follows:

  1. Ctrl or ⌘ + Shift + to close the charting space and open the design space.
  2. Ctrl or ⌘ + Shift + to close the design space and open the charting space.
  3. Ctrl or ⌘ + Shift + to incrementally lower the slider.
  4. Ctrl or ⌘ + Shift + to incrementally raise the slider.

The keyboard is your friend.

Left-click on the black background and drag to move around the workspace.

You may also use the following key combinations on your keyboard:

  1. Ctrl or ⌘ + to pan to the left.
  2. Ctrl or ⌘ + to pan to the right.
  3. Ctrl or ⌘ + to pan upwards.
  4. Ctrl or ⌘ + to pan downwards.

Node Shortcuts

You may define shortcuts for frequently-used nodes with the following procedure:

  1. Hover the mouse pointer over the target node until the menu opens up. This puts the node in focus.
  2. Click Ctrl or ⌘ + Alt + your preferred key to assign the shortcut.
  3. A sign will appear below the node confirming the assignation of the shortcut.

Custom shortcuts help you personalize your navigation.

Repeat the same procedure to remove a shortcut.

Node’s Menu

Hovering the mouse pointer over nodes causes a menu to pop up. In this situation, the node is in focus.

Arrangement Features

The design space functions under the paradigm of a self-organizing workspace in which nodes tend to find their place guided by certain laws of physics, and constrained by their chain relationships.

This self-organizing paradigm saves users the effort of maintaining the arrangement of nodes in a logical manner, in particular when manipulating or creating new nodes.

However, there will be times in which you will want to override this self-organizing nature. The following menu options are tools that will help you manipulate the arrangement of nodes, overriding the physics that affect their floating nature.

Icon Pinned / Unpinned — Click to cycle through the different options.
pinned The node is pinned to the workspace on a specific [x, y] coordinate. This status overrides any other setting affecting the node’s mobility. Only direct user action by clicking and dragging may move a pinned node.
unpinned When a node is unpinned, it is free to be affected by other settings, or find its place floating on the workspace.
Icon Freeze / Unfreeze — Click to cycle through the different options.
freeze Clicking the freeze option freezes the node’s chain connections with its parent and offspring. Connecting lines turn blue. If you freeze the head node of a hierarchy, then the whole hierarchy is frozen. Freezing node structures is effective only when nodes are loose, that is, when they are not affected by angle or distance settings and are unpinned. In such cases, freezing releases CPU resources, as the system stops calculating node’s positions and status.
unfreeze Clicking the unfreeze option unfreezes connections. If you click the option to unfreeze a node and the node does not change its status, it may be because a higher node in the hierarchy is still frozen.
Icon Collapse / Expand — Click to cycle through the different options.
collapse Clicking the minus button collapses the structure, hiding offspring nodes. This also has the effect of releasing CPU resources as the system stops calculating their position and status. In general, it is good practice to keep hierarchies closed when not being actively worked on.
expand Clicking the plus button expands the structure of offspring nodes.
Icon Angle to Parent — Click to cycle through the different options.
00 The rotational symmetry is disabled and the node may take any position. The connection line with its parent is yellow.
36 The node is locked to a rotational symmetry around its parent node, with sibling nodes using the same setting. The symmetry spans 360 degrees, and the connection line with the parent node turns orange.
180 The slot of the symmetry around its parent node is limited to 180 degrees, and the connection line remains orange.
90 The slot of the symmetry around its parent node is limited to 90 degrees, and the connection line remains orange.
45 The slot of the symmetry around its parent node is limited to 45 degrees, and the connection line remains orange.
Icon Distance to Parent — Click to cycle through the different options.
000 The distance setting is dissabled and the node may assume any distance to its parent.
025 The node is locked to a distance from its parent node that is 0.25X of the distance from the parent to its parent.
050 The node is locked to 0.5X of the distance.
100 The node is locked to 1X of the distance.
150 The node is locked to 1.5X of the distance.
200 The node is locked to 2X of the distance.
Icon Arrangement Style — Click to cycle through the different options.
concave The node adopts a slot on a circumsference around its parent node. In the icon’s graphic, the orange dot represents the parent node, and the blue dots represent the node adopting the specific arrangement style.
convex The node adopts a slot on a convex curve away from its parent node .
vertical-right The node adopts a slot on a vertical line to the right of its parent node.
vertical-left The node adopts a slot on a vertical line to the left of its parent node.
horizontal-bottom The node adopts a slot on a horizontal line below its parent node.
horizontal-top The node adopts a slot on a vertical line below its parent node.

Relationships and References

Icon Action
detach Detach: Breaks the parent-offspring relationship that keeps the node attached to its parent. Once detached, the node is no longer computed as part of the hierarchy it was attached to. Learn more about how to attach nodes
delink Delink: Removes the reference that may have existed between the node and a second node. Learn more about how to establish references.

Productivity Features

Icon Action
menu-backup Backup: Downloads a JSON file with the data structure and references concerning the particular node and the structure of offspring nodes in the hierarchy. Use this feature to save your entire workspace or any particular structure of nodes within your workspace so that you may later restore the information, including all references, should you need to. For your reference, the file downloaded is named Backup followed by the name of the node you are backing up. Learn more about the nuances of backups.
clone Clone: Downloads a JSON file containing information similar to a backup. The main difference is that the feature is built to facilitate the production of identical copies of any particular structure of nodes of a hierarchy, or a complete hierarchy. Use this feature to accelerate your work process when you need to replicate nodes, for example, to create multiple testing sessions. The file downloaded is named Clone followed by the name of the node you are cloning. Learn more about the nuances of clones.
menu-share Share: Downloads a JSON file containing information similar to a backup. The only difference is that no personal information is included. This is particularly important so that you do not share sensitive information accidentally, such as your API keys. Always use this function when you intend to share work. Do not share your backups. The file downloaded is named Share followed by the name of the node you are sharing. Learn more about the nuances of shares and the potential risks of using shared data structures from untrusted sources.
menu-delete Delete: Deletes the node and all its offspring. Confirmation in the form of an additional click is required.