# Diagram Editor - Controls

### Basic Diagram Editor controls

On the lower right corner of diagram editor you can find a toolbar with some basic tools to help you when you are creating/editing your diagram.

<figure><img src="/files/e1C3WPKhyGta7la6jAJF" alt=""><figcaption></figcaption></figure>

Here is a small description of each tool functionality:

<div align="left"><figure><img src="/files/UUVXTZAfCwX2dM0XZLJl" alt=""><figcaption></figcaption></figure></div>

| Tool / Button                       | Description                                                                                                           |
| ----------------------------------- | --------------------------------------------------------------------------------------------------------------------- |
| **Zoom in / zoom out**              | diagram zoom                                                                                                          |
| **Fit view**                        | automatically fits whole diagram on screen to fit whole view                                                          |
| **Lock \ Unlock diagram**           | You can toggle diagram lock on/off. When you turn off lock, you cannot move any nodes or connection on diagram        |
| **Align Horizontally \ Vertically** | You can select **multiple** link groups together and **align** selected groups in horizontal or vertical arrangement. |
| **Duplicate**                       | Duplicate selected groups including their conenctions.                                                                |
| **Delete**                          | deletes selected group nodes or selected connections (same as "**delete**" / "**backspace**" keys)                    |

### Selections

You can select select a **group** or a **connection** by clicking on them.

When you select a group, it will get highlighted as shown below.

<figure><img src="/files/YedPmBbex6ZovfGHA8yk" alt=""><figcaption><p>Group node selection</p></figcaption></figure>

When you select a connection it will get a dash-line highlight effect.

<figure><img src="/files/peKdOttOvAREuc3TaM2B" alt=""><figcaption><p>Selecting a connection</p></figcaption></figure>

You can also select multiple groups using **Ctrl** (Windows) / **Command** (Mac) to move or delete them.

<figure><img src="/files/KHgP48dE7A0V857fjs2l" alt=""><figcaption><p>Multiple selection of groups</p></figcaption></figure>

### Deleting groups & connections

To delete a group or a connection, select either a group or a connection and press "**delete**" or "**backspace**" on keyboard or use "**delete**" tool from toolbar.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.seoneo.io/documentation/diagram-editor/diagram-editor-controls.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.