> For the complete documentation index, see [llms.txt](https://docs.aohwv.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.aohwv.dev/features/graph-visualization.md).

# Graph Visualization

CloudSync's Graph Visualization feature lets you explore identity relationships visually, making it easy to understand organizational structures and group memberships.

***

## Overview

The Graph Explorer displays users, groups, and their relationships as an interactive network diagram. You can navigate, search, filter, and drill down into specific areas of your organization.

***

## Who This Is For

* Administrators understanding organizational structure
* Operators investigating user relationships
* Anyone needing visual insight into identity data

***

## Prerequisites

* ✅ Logged into CloudSync
* ✅ At least Viewer role
* ✅ Data has been synced (graph needs data to display)

***

## Accessing Graph Visualization

{% stepper %}
{% step %}

#### Log in to CloudSync

Sign in with your account.
{% endstep %}

{% step %}

#### Open Graph Explorer

Click **Graph Explorer** in the sidebar.
{% endstep %}

{% step %}

#### View the graph

The graph loads with your identity data.
{% endstep %}
{% endstepper %}

***

## Understanding the Graph

### Node Types

Nodes represent entities in your identity system:

| Node          | Shape   | Color  | Represents                     |
| ------------- | ------- | ------ | ------------------------------ |
| 👤 User       | Circle  | Blue   | Individual user                |
| 👥 Group      | Hexagon | Green  | Security or distribution group |
| 🏢 Department | Square  | Purple | Organizational unit            |
| 📍 Location   | Diamond | Orange | Office location                |

### Edges (Connections)

Lines between nodes show relationships:

| Line Style      | Meaning                                     |
| --------------- | ------------------------------------------- |
| Solid line      | Direct relationship (member of, reports to) |
| Dashed line     | Indirect relationship (through group)       |
| Arrow direction | Points from child to parent                 |

### Node Size

* **Larger nodes** = More connections
* **Smaller nodes** = Fewer connections

A large group node has many members; a large user node may be a manager with many reports.

***

## Navigating the Graph

### Mouse/Trackpad Controls

| Action           | How                       |
| ---------------- | ------------------------- |
| **Pan**          | Click and drag background |
| **Zoom in**      | Scroll up / pinch out     |
| **Zoom out**     | Scroll down / pinch in    |
| **Select node**  | Click on it               |
| **Multi-select** | Ctrl/⌘ + click            |

### Keyboard Controls

| Key          | Action             |
| ------------ | ------------------ |
| `+` / `=`    | Zoom in            |
| `-`          | Zoom out           |
| `0`          | Reset zoom         |
| `Arrow keys` | Pan                |
| `F`          | Focus on selection |
| `Esc`        | Clear selection    |

***

## Selecting and Inspecting Nodes

### Click a Node

{% stepper %}
{% step %}

#### Node highlights

The clicked node highlights with a glow.
{% endstep %}

{% step %}

#### Info panel appears

An info panel appears on the right with details.
{% endstep %}

{% step %}

#### Connected nodes highlight

Connected nodes are highlighted to show relationships.
{% endstep %}
{% endstepper %}

### Info Panel

The info panel shows details about the selected node.

**For Users:**

{% code title="User info panel" %}

```
┌─────────────────────────────────────┐
│ John Smith                          │
│ john.smith@company.com              │
├─────────────────────────────────────┤
│ Department: Engineering             │
│ Title: Senior Developer             │
│ Manager: Jane Doe                   │
│ Location: New York                  │
│ ─────────────────────────────────── │
│ Groups: 5                           │
│ Direct Reports: 3                   │
│ ─────────────────────────────────── │
│ [View Details]  [Sync Now]          │
└─────────────────────────────────────┘
```

{% endcode %}

**For Groups:**

{% code title="Group info panel" %}

```
┌─────────────────────────────────────┐
│ Engineering Team                    │
│ Security Group                      │
├─────────────────────────────────────┤
│ Members: 42                         │
│ Nested Groups: 3                    │
│ Created: 2024-03-15                 │
│ ─────────────────────────────────── │
│ [View Members]  [Expand]            │
└─────────────────────────────────────┘
```

{% endcode %}

***

## Filtering the Graph

### Search

{% stepper %}
{% step %}

#### Focus the search

Click the **Search** field (or press `/`).
{% endstep %}

{% step %}

#### Enter query

Type a name, email, or group name.
{% endstep %}

{% step %}

#### Select result

Matching nodes highlight. Click a result to focus on it.
{% endstep %}
{% endstepper %}

### Filters

{% stepper %}
{% step %}

#### Open Filters

Click the **Filter** icon (funnel).
{% endstep %}

{% step %}

#### Toggle node types

Toggle node types on/off:

* ✅ Users
* ✅ Groups
* ✅ Departments
* ✅ Locations
  {% endstep %}

{% step %}

#### Apply

Graph updates immediately.
{% endstep %}
{% endstepper %}

### Department Filter

{% stepper %}
{% step %}

#### Open Filters

Open the Filters panel.
{% endstep %}

{% step %}

#### Select Departments

Under **Departments**, select one or more.
{% endstep %}

{% step %}

#### View results

Only users/groups in those departments appear.
{% endstep %}
{% endstepper %}

***

## Graph Layouts

Choose how nodes are arranged:

| Layout             | Best For                      |
| ------------------ | ----------------------------- |
| **Force-directed** | General exploration (default) |
| **Hierarchical**   | Reporting structures          |
| **Circular**       | Group memberships             |
| **Tree**           | Manager-report relationships  |

### Change Layout

{% stepper %}
{% step %}

#### Open layout menu

Click the **Layout** button (grid icon).
{% endstep %}

{% step %}

#### Select layout

Choose a layout from the list.
{% endstep %}

{% step %}

#### View change

Graph re-arranges (animated).
{% endstep %}
{% endstepper %}

***

## Common Tasks

### View a User's Manager Chain

{% stepper %}
{% step %}

#### Search for the user

Find the user using Search.
{% endstep %}

{% step %}

#### Select user

Click their node.
{% endstep %}

{% step %}

#### Show hierarchy

In the info panel, click **Show Hierarchy**. The graph expands upward to show the manager chain.
{% endstep %}
{% endstepper %}

### See All Members of a Group

{% stepper %}
{% step %}

#### Find the group

Search for or navigate to the group.
{% endstep %}

{% step %}

#### Select group

Click the group node.
{% endstep %}

{% step %}

#### Expand members

In the info panel, click **Expand Members**. All direct members appear around the group.
{% endstep %}
{% endstepper %}

### Find Users Without a Manager

{% stepper %}
{% step %}

#### Open Filters

Open the Filters panel.
{% endstep %}

{% step %}

#### Enable orphans

Enable **Show Orphans**.
{% endstep %}

{% step %}

#### Review results

Nodes without manager relationships highlight. Review and investigate in HR system.
{% endstep %}
{% endstepper %}

### Trace Group Memberships

{% stepper %}
{% step %}

#### Select a user

Click a user node.
{% endstep %}

{% step %}

#### Show groups

In the info panel, click **Show Groups**. All groups the user belongs to appear.
{% endstep %}

{% step %}

#### Inspect group

Click a group to see other members.
{% endstep %}
{% endstepper %}

***

## What You Should See

A well-connected graph shows:

* **Clusters** around managers and departments
* **Hubs** (large nodes) at group and department centers
* **Orphans** (isolated nodes) indicate potential data issues

### Healthy Graph

{% code title="Healthy graph (ASCII)" %}

```
        ┌──👤──┐
        │      │
   👤───👥───👤───👤
   │    │         │
   👤   👤───👤   👤
```

{% endcode %}

### Potential Issues

* **Isolated nodes** — Users with no connections (check manager assignment)
* **Missing groups** — Expected groups not appearing (check group sync)
* **Unexpected connections** — Review for data accuracy

***

## Troubleshooting

### Graph is empty

| Cause                    | Solution         |
| ------------------------ | ---------------- |
| No syncs completed       | Run a sync first |
| Filters hiding all nodes | Reset filters    |
| Loading error            | Refresh the page |

### Graph is too cluttered

| Solution                | How                      |
| ----------------------- | ------------------------ |
| Filter by department    | Show only one department |
| Increase zoom           | Zoom out for overview    |
| Use hierarchical layout | Better for large orgs    |
| Search and focus        | Find specific areas      |

### Graph loads slowly

| Cause                           | Solution                           |
| ------------------------------- | ---------------------------------- |
| Large organization (10k+ users) | Use filters to limit scope         |
| Browser limitations             | Try Chrome or Edge                 |
| Many relationships              | Collapse groups (don't expand all) |

***

## Next Steps

* [User Management](/administration/users.md) — Manage individual users
* [Monitoring Syncs](/features/monitoring.md) — Track sync health
* [Reports](/features/reports.md) — Export organizational data

***

## Related Topics

* [Users and Groups](broken://pages/T6FdZ9tELFffsuT4Rqfj) — Understand identity data


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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.aohwv.dev/features/graph-visualization.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.
