# Graph View

In graph view, you can edit the selected graph on the Graphs tab.

## Basic operation method

Operation details | Windows | Mac
--- | --- | ---
Scroll | `Middle mouse button drag` `Alt` + `Left mouse button drag` | `Middle mouse button drag` `option ⌥` + `Mouse button drag`
Vertical scroll | `Mouse wheel` | `Mouse wheel`
Horizontal scroll | `Shift` + `mouse wheel` | `shift ⇧` + `mouse wheel`
Zoom | `Ctrl` + `Mouse Wheel` `Ctrl` + `Right Mouse Button Drag` | `command ⌘` + `Mouse Wheel` `command ⌘` + `control ⌃` + `Mouse button drag`
Menu display | `Right mouse button click` | `control ⌃` + `mouse button click`
Select a node | `Click the left mouse button` on the node | `Click the mouse button` on the node
Add/cancel selection | `Ctrl` + `left mouse button click` on the node | `command ⌘` + `mouse button click` on the node
Select all child nodes | `Alt` + `left mouse button click` on the node | `option ⌥` + `mouse button click` on the node
Select parent nodes | `Shift` + `left mouse button click` on the node | `shift ⇧` + `mouse button click` on the node
Rectangular selection of nodes | `Left mouse button drag` | `Mouse button drag`
Add mode | `Shift` + `left mouse button drag` | `shift ⇧` + `mouse button drag`
Release mode | `Ctrl` + `left mouse button drag` | `command ⌘` + `mouse button drag`
Moving a node | `Drag left mouse button` on a node | `Drag mouse button` on a node

### Shortcut keys

Operation details | Windows | Mac
--- | --- | ---
Scroll | `WASD key` | `WASD key`
Enlarge | `Ctrl` + `]key` | `command ⌘` + `]key`
Reduce | `Ctrl` + `[key` | `command ⌘` + `[key`
Create node | `Space key` | `Space key`
Move selected node | `Arrow keys` | `Arrow keys`
Delete selected node | `Delete key` | `Delete key`
Screenshot | `Shift key` + `P key` | `shift ⇧` + `P key`
Display comments for all nodes | `Ctrl` + `Shift` + `K key` | `command ⌘` + `shift ⇧` + `K key`
Hide comments for all nodes | `Ctrl` + `Shift` + `L key` | `command ⌘` + `shift ⇧` + `L key`
Display comment for selected node | `Ctrl` + `K key` | `command ⌘` + `K key`
Hide comments of selected node | `Ctrl` + `L key` | `command ⌘` + `L key`
Create group node (When selecting a node, create a size that encloses the selected node) | `G key` | `G key`
Create comment node | `C key` | `C key`
Put all nodes in the frame | `Home key` | `Home key`
Toggle breakpoint on selected node | `F9 key` | `F9 key`
Disable breakpoints on all nodes | `Alt` + `F9 key` | `option ⌥` + `F9 key`

Depending on your keyboard layout, the default shortcut keys may not respond. If necessary, open the Shortcuts window from Edit > Shortcuts… in the menu, select the “Logic Toolkit” category, and configure settings.

### Input Hints

When you hover the mouse over some UI elements, input hints such as modifier keys are displayed.

You can turn on or off the display of input hints in Project Settings.

## How to operate nodes

### Creating a node

1. Displaying the node menu Please display using one of the following methods.
   - Right-click on the graph and select Create Node from the menu *Click on the graph and press the `Spacebar` while the focus is on it.
2. Select the node you want to create from the menu
3. The node will be created and you will be in name input mode, so enter the name.
4. Confirm with `Enter key`

### Delete node

You can delete it using one of the following methods:

- Right-click the node and select Delete from the menu
- Select the node and press the `Delete key`

## Node comment

Nodes have the ability to leave comments.

### Displaying node comments

You can display it using one of the following methods:

- Select Show Comment from the right-click menu
- Click the “…” icon that appears when you hover over the node
- Select a node and press `Ctrl` + `K key` (Windows) / `command ⌘` + `K key` (Mac)
- To display all node comments, press `Ctrl` + `Shift` + `K key` (Windows) / `command ⌘` + `shift ⇧` + `K key` (Mac)

### Editing node comments

Click the displayed node comment field and enter the string.

### Hide node comments

You can hide it using one of the following methods:

- Select Show Comment from the right-click menu *Click the “▼” icon that appears when you hover over the node comment field
- Select a node and press `Ctrl` + `L key` (Windows) / `command ⌘` + `L key` (Mac)
- To hide all node comments, press `Ctrl` + `Shift` + `L key` (Windows) / `command ⌘` + `shift ⇧` + `L key` (Mac)

### Fixed size of node comments

You can fix the size of the displayed node comment even when you zoom the graph.

*Click the “🔒” icon that appears when you hover over the node comment field

## How to operate ports/wires

### Connecting ports

1. Start dragging ports
2. Drop to destination port

### Magnet connection for ports

It can be connected like a magnet to the port closest to the mouse cursor.

1. Start dragging ports
2. Hold down `Shift` and move the mouse cursor near the destination port
3. Release the mouse button when a dotted line appears between the port you want to connect to.

The magnet range can be configured in Project Settings.

### Create a node by dragging ports

1. Start dragging ports
2. Drop it on an empty spot on the graph
3. Select the node you want to create from the menu
4. The node will be created and you will be in name input mode, so enter the name.
5. Confirm with `Enter key`

### Cutting the wire

You can disconnect using one of the following methods:

- Right-click on the wire and select Disconnect from the menu
- Right-click the port to which the wire is connected and select Disconnect or Disconnect All from the menu
- Hold down `Alt` (Windows)/`option ⌥` (Mac) and click the left mouse button on the wire

### Inserting a reroute node

You can insert a reroute node in one of the following ways:

- Right-click on the wire and select Reroute from the menu
- Hold down `Ctrl` (Windows)/`command ⌘` (Mac) and click the left mouse button on the wire

### Create a reroute node by dragging ports

1. Start dragging ports
2. Hold down `Ctrl` (Windows)/`command ⌘` (Mac) and drop it on an empty area of the graph.

### Input drag of reroute port

1. Hold down `Shift` and drag the left mouse button

### Insert reroute node by dragging port

1. Start dragging ports
2. Hold down `Ctrl` (Windows)/`command ⌘` (Mac) and drop it on the wire you want to insert.