Ilograph

https://www.ilograph.com/docs/
Admin
Ilograph is an interactive diagramming tool for documenting complex systems with detailed,...
Tokens:16,940
Snippets:171
Trust Score:8.1
Update:7 months ago
Show doc for...
Tokens:
Raw
### Ilograph Team Workspace API - Setup

Source: https://www.ilograph.com/docs/team-workspace-api

Instructions for setting up API access, including creating access keys with specific permissions and adding IP addresses to the allow-list.

```APIDOC
## Ilograph Team Workspace API - Setup

### Description
This section details the steps required to enable API access for your Ilograph Team+ workspace. This involves generating an access key with appropriate permissions and configuring an IP allow-list for secure access.

### Creating an Access Key

1. Navigate to your team workspace homepage.
2. Click "API Access" in the top-right corner.
3. Click "Add access key".
4. Provide a name and expiration time for the key.
5. Click "Add permission" to define access levels (read, write, or both) for specific diagrams or folders. Use `*` for all diagrams in the workspace, but fine-grained permissions are recommended.
6. Click "Create access key". **Record the key immediately as it will only be shown once.**

### Adding IP Addresses to the Allow-List

1. Navigate to your team workspace homepage.
2. Click "API Access" in the top-right corner.
3. Click "Add IP address".
4. Enter the IPv4 or IPv6 address and an optional note.
5. Click "Add IP address".

### Request Headers
All API requests must include the following headers:
- **accessKey**: Your generated API access key.
- **Originating IP Address**: Must be on the allow-list.
```

--------------------------------

### Markdown: Headers Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Shows how to implement different levels of headers using Markdown in a YAML resource description. Headers help structure content and improve organization.

```yaml
- ...
  description: |-
    This descriptions has multiple headers:
    # Header 1
    ## Header 2
    ### Header 3
    etc.

```

--------------------------------

### Markdown: Code Block Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Provides an example of embedding a multi-line code block using Markdown within a YAML resource description. This is ideal for showcasing longer code examples.

```yaml
- ...
  description: |-
    This description has a code block:
  
    ```
    int main() {
      printf("Hello World");
      return 0;
    }
    ```

```

--------------------------------

### Markdown: Bold Text Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Demonstrates how to apply bold text formatting using Markdown within a YAML resource description. This enhances readability by highlighting important information.

```yaml
- name: Resource A
  subtitle: A Resource
  description: This description has **bold** text
```

--------------------------------

### Markdown: List Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Illustrates the creation of a bulleted list using Markdown within a YAML resource description. Lists are effective for presenting series of items or steps.

```yaml
- ...
  description: |-
    This descriptions has a bulleted list:
    - Item 1
    - Item 2
    - Item 3

```

--------------------------------

### Markdown: Inline Code Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Illustrates the use of inline code formatting with Markdown in a YAML resource description. This is useful for displaying short code snippets or technical terms.

```yaml
...
  description: This description has `code` text
```

--------------------------------

### Markdown: External Link Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Demonstrates how to create an external hyperlink using Markdown within a YAML resource description. Links allow users to navigate to external websites.

```yaml
- ...
  description: This description has a
        [link](https://www.ilograph.com)
```

--------------------------------

### Define Ilograph Resources and Perspectives

Source: https://www.ilograph.com/docs/editing/contexts

Initial setup for an Ilograph diagram defining AWS resources and a dependency perspective. This establishes the base structure for the resource tree and the relationships between components.

```YAML
imports: 
- from: ilograph/aws
  namespace: AWS

resources:
- name: Amazon Web Services
  instanceOf: AWS::AWS Instance
  children:
  - name: Lambda
    instanceOf: AWS::Lambda
    children: 
    - name: getOrder
      instanceOf: AWS::Lambda::Function
    - name: getUser
      instanceOf: AWS::Lambda::Function
  - name: API Gateway
    instanceOf: AWS::ApiGateway
    children: 
    - name: Order
      instanceOf: AWS::ApiGateway::Resource
    - name: User
      instanceOf: AWS::ApiGateway::Resource

perspectives:
- name: Dependency
  defaultArrowLabel: Calls
  relations:
  - from: Order
    to: getOrder
  - from: User
    to: getUser
```

--------------------------------

### Markdown: Internal Link to Subsequence Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Shows how to create an internal link to a subsequence within a perspective using Markdown in a YAML resource description. This allows for precise navigation within complex structures.

```yaml
- ...
  description: This description has a link to
  the [Code](#Code/SubequenceName) perspective
```

--------------------------------

### Markdown: Internal Link to Perspective Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Demonstrates creating an internal link to a specific perspective using Markdown within a YAML resource description. This facilitates navigation within the documentation.

```yaml
- ...
  description: This description has a link to
  the [Code](#Code) perspective
```

--------------------------------

### Markdown: Italicized Text Example (YAML)

Source: https://www.ilograph.com/docs/editing/markdown

Shows how to format text in italics using Markdown within a YAML resource description. Italicization can be used for emphasis or stylistic purposes.

```yaml
- ...
  description: This description has *italicized* 
  text
```

--------------------------------

### Define a Sequence Perspective in Ilograph Source

Source: https://www.ilograph.com/docs/editing/perspectives/sequence-perspectives

This snippet demonstrates the basic structure for defining a sequence perspective in Ilograph source. It includes the 'sequence' property to indicate a sequence, 'start' to define the initial resource, and 'steps' to outline the interactions. The 'steps' array contains objects with 'to' or 'toAndBack' properties to specify the target resource and optional 'label' for arrow annotation.

```yaml
# Resource tree omitted
...
perspectives:
- name: Get Diagram
  color: LimeGreen
  sequence:
      start: Users
      steps:
      - to: ns
        label: Get diagram
      - toAndBack: iloUsers
        label: Authenticate user

      - to: getIlograph
        label: Invoke
      - toAndBack: Ilographs
        label: Get metadata
      - toAndBack: Permissions
        label: Get permission
      - toAndBack: diagrams.ilograph.com
        label: Retrieve content

      - to: ns
        label: Return diagram
      - to: Users
        label: Return diagram
...

```

--------------------------------

### Add Multi-line Resource Description in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

This snippet demonstrates how to define a multi-line description for a resource. By starting the description with `|-` and a new line, Ilograph interprets the subsequent lines as part of the description, allowing for formatted text with line breaks and markdown.

```yaml
resources:
- name: Resource A
  description: |-
    This is a description
    with multiple lines
```

--------------------------------

### Define a Sub-Sequence in Ilograph Source

Source: https://www.ilograph.com/docs/editing/perspectives/sequence-perspectives

This code example illustrates how to define a nested sub-sequence within a main sequence perspective. A step can contain a 'subSequence' property, which itself is an array of steps. Sub-sequences can have a 'name', an optional 'color', and 'steps'. This allows for hierarchical representation of complex interactions.

```yaml
# Resource tree omitted
...
perspectives:
- name: Get Diagram
  ...
  sequence:
      start: Users
      steps:
      ...
      - subSequence:
        - name: My Sub-Sequence
          color: blue
          steps:
          - to: getIlograph
            label: Invoke
          - toAndBack: Ilographs
            label: Get metadata
          - toAndBack: Permissions
      ...


```

--------------------------------

### Define and Configure Ilograph Resources

Source: https://www.ilograph.com/docs/editing/tutorial

Demonstrates the syntax for defining resources in Ilograph, including setting attributes like color, subtitle, and icons.

```Ilograph
resources:
  - name: Users
    color: Green
    subtitle: Our awesome users
  - name: Service A
    icon: aws/compute/ec2
  - name: New Service
    color: DarkCyan
```

--------------------------------

### Defining Abstract Resources and Inheritance in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

Demonstrates how to define an abstract resource to serve as a template and how to instantiate it using the 'instanceOf' property to inherit properties and children.

```yaml
resources:
- name: Switch
  subtitle:  Network Switch
  color: navy
  description: A three-port switch
  abstract: true
  children:
    - name: Port 1
    - name: Port 2
    - name: Port 3

- name: Switch A
  instanceOf: Switch
  
- name: Switch B
  instanceOf: Switch
```

--------------------------------

### Reference Resources using Hierarchical Paths

Source: https://www.ilograph.com/docs/editing/perspectives/references

Shows how to distinguish between resources with identical names by prepending parent resource names with forward slashes in a perspective definition.

```yaml
perspectives:
- name: Availability Zone
  color: green
  defaultArrowLabel: Runs in
  relations:
  - from: Alpha
    to: us-east-1/AZ1
  - from: Bravo
    to: us-east-1/AZ2
  - from: Charlie
    to: us-east-2/AZ1
  - from: Delta
    to: us-east-2/AZ2
```

--------------------------------

### Create Resource Clones in Ilograph Perspectives

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

Demonstrates how to define resources and reference them within a perspective using the cloning syntax. By appending an asterisk and an identifier (e.g., *2) to the resource name, a unique clone is generated for the visualization.

```yaml
resources:
- name: Resource A
- name: Resource B
    
perspectives:
- name: Dependency
  relations:
  - from: Resource A
    to: Resource B
  - from: Resource B
    to: Resource A *2
```

--------------------------------

### Define and Use Aliases

Source: https://www.ilograph.com/docs/editing/perspectives/references

Demonstrates how to group multiple resource references under a single alias ID to simplify relation definitions in perspectives.

```yaml
perspectives:
- name: My Perspective
  aliases: 
  - alias: RACK_A_SERVERS
    for: NY-WEB01, NY-WEB03, NY-WEB05, NY-WEB07, NY-WEB09, NY-WEB11
  relations:
    - from: Main Server
      to: RACK_A_SERVERS
```

--------------------------------

### Referencing Inherited Resources in Perspectives

Source: https://www.ilograph.com/docs/editing/resources

Shows how to reference resources that utilize inheritance within a perspective's relations, demonstrating that perspectives remain agnostic to the underlying inheritance structure.

```yaml
perspectives:
- name: Network
  relations:
    - from: Alpha
      to: Switch A/Port 1
    - from: Bravo
      to: Switch A/Port 2
    - from: Charlie
      to: Switch A/Port 3
    - from: Delta
      to: Switch B/Port 1
    - from: Echo
      to: Switch B/Port 2
    - from: Foxtrot
      to: Switch B/Port 3
```

--------------------------------

### Ilograph: Multi-reference Matching (All Instances)

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

Illustrates how to use square brackets `[]` in Ilograph to match all instances of a resource with a given identifier. This is useful for creating relations to multiple identical resources simultaneously.

```Ilograph
  relations:
    - from: Main Server
    - to: [Port 1] # Matches **ALL** instances of _Port 1_
```

--------------------------------

### Import Configuration

Source: https://www.ilograph.com/docs/spec

Defines external diagrams to import and their associated namespaces.

```APIDOC
## Import Configuration

### Description
Specifies diagrams to import into the current project.

### Request Body
- **from** (string) - Required - The diagram identifier to import.
- **namespace** (string) - Required - Namespace prefix for imported resources.

### Request Example
{
  "import": {
    "from": "diagram-id-123",
    "namespace": "myNamespace"
  }
}
```

--------------------------------

### Add Key-Value Resource Description in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

This snippet shows how to define a resource description using key-value pairs. This format renders as a table in the Ilograph UI, providing a structured way to present resource attributes. Keys cannot contain markdown, but values can.

```yaml
resources:
- name: My EC2 Instance
  description:
    Type: c6g.xlarge
    vCPU: 4
    Memory: 8GB
    Instance ID: i-abcd1234efgh5678
```

--------------------------------

### Ilograph: Multi-reference Matching with Wildcards

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

Demonstrates the use of wildcards (`*`) within square brackets for multi-reference matching in Ilograph. This enables matching all resources whose names match a pattern, such as all 'Port' resources.

```Ilograph
  relations:
    - from: Main Server
    - to: [Port *] # Matches **ALL** _Port_s
```

--------------------------------

### Perspective Options Configuration

Source: https://www.ilograph.com/docs/spec

Defines the appearance and behavior options for a perspective, nested under the options property.

```APIDOC
## Perspective Options

### Description
Configures visual and behavioral properties for a perspective.

### Request Body
- **additionalContext** (string) - Optional - Context display mode (all, none, super-only, sub-only). Defaults to super-only.
- **arrowDirection** (string) - Optional - Default arrow direction (forward, backward, bidirectional). Defaults to forward.
- **deduplicateImportedResources** (boolean) - Optional - De-duplicate resources imported multiple times. Defaults to true.
- **defaultArrowColor** (string) - Optional - Default color for relation arrows.
- **defaultArrowLabel** (string) - Optional - Default label for relation arrows.
- **extendWalkthrough** (boolean) - Optional - Inherit walkthroughs from extended perspectives. Defaults to true.
- **hidden** (boolean) - Optional - Hide perspective from the list.
- **hideEmbedded** (boolean) - Optional - Fade out details of embedded resources.
- **initialDetailLevel** (number) - Optional - Initial zoom/detail level (0 to 1).
- **unwrapContext** (boolean) - Optional - Omit context to force arrow direction. Defaults to false.

### Request Example
{
  "options": {
    "additionalContext": "all",
    "arrowDirection": "forward",
    "hidden": false
  }
}
```

--------------------------------

### Define Relational Perspectives in Ilograph

Source: https://www.ilograph.com/docs/editing/tutorial

Shows how to define relationships between resources within a perspective, allowing the diagram to visualize connections.

```Ilograph
perspectives:
  - name: Dependency
    relations:
      - from: Users
        to: [Service A, Service B, New Service]
      - from: New Service
        to: Data Store X
        label: Write
```

--------------------------------

### Add Relation Descriptions

Source: https://www.ilograph.com/docs/editing/perspectives/relation-perspectives

Shows how to include detailed markdown-supported descriptions for relations, which are displayed on hover or tap.

```yaml
relations:
- from: Quick Send
  to: WhosWho
  label: Uses
  description: Retrieves user information and permissions
```

--------------------------------

### Configure Relation Labels and Colors

Source: https://www.ilograph.com/docs/editing/perspectives/relation-perspectives

Explains how to add visual context to relations using default or explicit labels and colors for better readability.

```yaml
perspectives:
- name: Service
  defaultArrowLabel: Depends On
  relations:
  - from: Quick Send
    to: WhosWho
    label: Uses
    color: HotPink
```

--------------------------------

### Layout Configuration

Source: https://www.ilograph.com/docs/spec

Governs the spatial arrangement and sizing of child elements within a parent resource.

```APIDOC
## Layout Configuration

### Description
Controls the compactness and sizing logic for child resources.

### Request Body
- **compactness** (number) - Optional - Compactness factor (0.1 to 1). Defaults to 1.
- **sizes** (string) - Optional - Sizing strategy (proportional, uniform, auto). Defaults to auto.

### Request Example
{
  "layout": {
    "compactness": 0.8,
    "sizes": "proportional"
  }
}
```

--------------------------------

### Ilograph: Multi-reference Matching with Wildcards and Descendants

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

Explains how to combine wildcard matching with descendant references in Ilograph. This allows for flexible matching of resources that meet a pattern and are located under a specific parent.

```Ilograph
  relations:
    - from: Main Server
    - to: Switch A/[Port *] # Matches **ALL** _Port_s that are direct descendants of _Switch A_
```

--------------------------------

### Define Routing with Relative References in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code demonstrates the use of relative references ('../') in Ilograph to define routing from a Firewall to its corresponding Load Balancer within the same system. This effectively reduces repetition while maintaining accurate relationships.

```yaml
perspectives:
- name: Routing
  relations:
  - from: [Firewall]
    to: ../Load Balancer
    label: Traffic
```

--------------------------------

### Combine Multiple Target Resources

Source: https://www.ilograph.com/docs/editing/perspectives/relation-perspectives

Shows how to reference multiple target resources in a single relation definition using a comma-separated list.

```yaml
relations:
- from: MiniChat
  to: WhosWho
- from: Quick Send
  to: WhosWho, LongStore
```

--------------------------------

### Reference Descendant Resources

Source: https://www.ilograph.com/docs/editing/perspectives/references

Illustrates the use of double forward slashes to match any descendant resource within a specific parent hierarchy.

```yaml
relations:
  - to: us-east-1//Load Balancer
```

--------------------------------

### Define Basic Relations in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/relation-perspectives

Demonstrates how to declare static relationships between resources using the 'from' and 'to' properties within a perspective.

```yaml
perspectives:
- name: Service
  relations:
  - from: MiniChat
    to: WhosWho
  - from: Quick Send
    to: WhosWho
  - from: Quick Send
    to: LongStore
```

--------------------------------

### Define Abstract System Model in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code defines an abstract 'System' model with nested resources like Firewall, Load Balancer, and Instances. This model serves as a template for creating multiple identical systems, reducing repetition in the overall configuration.

```yaml
resources:
- name: System
  icon: Networking/computer-network.svg
  color: RoyalBlue
  abstract: true
  children: 
  - name: Firewall
    color: Firebrick
    icon: Networking/firewall.svg
    
  - name: Load Balancer
    color: DarkCyan
    icon: Networking/network-hub.svg
    
  - name: Instance A
    color: DeepPink
    icon: Networking/server.svg
    
  - name: Instance B
    color: DarkBlue
    icon: Networking/server.svg
    
- name: System 1
  instanceOf: System
    
- name: System 2
  instanceOf: System
    
- name: System 3
  instanceOf: System
```

--------------------------------

### Navigate Multiple Ancestors with Relative References in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code snippet illustrates how to use multiple '../' prefixes in a relative reference to navigate up multiple levels in the resource tree. This is useful for defining relationships to resources higher up in the hierarchy.

```yaml
to: ../../../Resource
```

--------------------------------

### Manually Set Resource Order with 'From-Only' Relations

Source: https://www.ilograph.com/docs/editing/perspectives/resource-sizes-and-positions

For complex Ilograph perspectives, you can manually control resource order by adding a 'from-only' relation at the beginning of the relation list. This trick allows you to specify the desired top-to-bottom order without altering existing relations. Multiple resources can be ordered by separating them with commas.

```yaml
perspectives:
- name: Dependency
  defaultArrowLabel: Read/Write
  relations:

  - from: Service B # Added to make "Service B" appear higher

  - from: Service A
    to: Data Store X

  - from: Service B
    to: Data Store X
```

```yaml
perspectives:
- name: Dependency
  relations:

  - from: Service B, Service X, Service Y #... etc.

  ... # original relations here
```

--------------------------------

### Define Hierarchical Resources with Children in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

This snippet illustrates how to create a resource hierarchy by defining child resources under a parent resource using the `children` property. It also shows how these resources can be referenced in `perspectives` and how parent resources act as context resources.

```yaml
resources:
- name: My Company's AWS Instance
  subtitle: AWS Instance
  children:
  - name: getOrder
    icon: AWS/Compute/Lambda.svg
    subtitle: Lambda function

  - name: createOrder
    icon: AWS/Compute/Lambda.svg
    subtitle: Lambda function
    
  - name: Order
    icon: AWS/Database/DynamoDB_Table.svg
    subtitle: Database table

perspectives:
- name: Simple Perspective
  relations: 
  - from: getOrder, createOrder
    to: Order
```

--------------------------------

### Define Resource Properties (Name, Subtitle, Icon) in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

This snippet demonstrates how to define properties for a resource, including `name`, `subtitle`, and `icon`. The `name` is mandatory, while `subtitle` and `icon` provide additional descriptive information and visual representation. The `icon` path refers to an icon defined within the Ilograph system.

```yaml
resources:
- name: Order
  subtitle: Database table
  icon: AWS/Database/DynamoDB_Table.svg
```

--------------------------------

### Define Routing with Relative References and Multi-Matching in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code combines relative references with multi-reference matching to define two routing rules: Firewall to Load Balancer, and Load Balancer to its Instances. It showcases how to specify relationships relative to the parent resource.

```yaml
perspectives:
- name: Routing
  relations:
  - from: [Firewall]
    to: ../Load Balancer
    label: Traffic

  - from: [Load Balancer]
    to: ../[Instance *]
    label: Routes to
```

--------------------------------

### Ilograph: Multi-reference Matching with Descendants

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

Shows how to combine multi-reference matching with descendant references in Ilograph. This allows matching all instances of a resource that are descendants of a specific parent resource.

```Ilograph
  relations:
    - from: Main Server
    - to: Data Center 1//[Port 1] # Will match **ALL** instances of _Port 1_ that 
                                  are descendants of _Data Center 1_
```

--------------------------------

### Configure Ilograph Contexts

Source: https://www.ilograph.com/docs/editing/contexts

Demonstrates how to add a 'contexts' property to an Ilograph diagram to group resources by region. This allows users to toggle between different organizational views while maintaining consistent relationship arrows.

```YAML
resources:
...
- name: us-east-1
  instanceOf: AWS::Region
- name: us-east-2
  instanceOf: AWS::Region

contexts: 
- name: Region
  roots: 
  - resourceId: Amazon Web Services
    children: 
    - resourceId: us-east-1
      children: 
      - resourceId: Order, getOrder
    - resourceId: us-east-2
      children: 
      - resourceId: User, getUser
```

--------------------------------

### Define Routing with Multi-Reference Matching in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code uses multi-reference matching to define a single routing rule between Firewalls and Load Balancers. While shorter, this approach incorrectly routes every Firewall to every Load Balancer, as it lacks specificity.

```yaml
perspectives:
- name: Routing
  relations:
  - from: [Firewall]
    to: [Load Balancer]
    label: Traffic
```

--------------------------------

### Define Hierarchical Resources in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/references

Demonstrates the structure for defining nested resources such as AWS regions and availability zones to establish a hierarchy for later referencing.

```yaml
resources:
- name: AWS
  subtitle: Cloud service provider
  children:
  - name: us-east-1
    subtitle: Region
    color: green
    children:
    - name: AZ1
      subtitle: Availability Zone
      color: darkgreen
    - name: AZ2
      subtitle: Availability Zone
      color: darkgreen
  - name: us-east-2
    subtitle: Region
    color: green
    children:
    - name: AZ1
      subtitle: Availability Zone
      color: darkgreen
    - name: AZ2
      subtitle: Availability Zone
      color: darkgreen
```

--------------------------------

### Define Via Intermediate Relations

Source: https://www.ilograph.com/docs/editing/perspectives/relation-perspectives

Demonstrates how to route relations through intermediate resources using the 'via' property to represent complex paths.

```yaml
relations:
- from: Users (East)
  to: Service A, Service B, Service C
  via: Load Balancer (Global)

- from: Users (West)
  via: Load Balancer (Global), Load Balancer (West)
```

--------------------------------

### Declare Basic Resources in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

This snippet shows the basic syntax for declaring resources in an Ilograph diagram. Resources are defined under the top-level `resources` property as a list. Each resource must have at least a `name`.

```yaml
resources:
- name: Resource A
- name: Resource B
- name: Resource C
```

--------------------------------

### Add Single-line Resource Description in Ilograph

Source: https://www.ilograph.com/docs/editing/resources

This snippet shows how to add a simple, single-line description to a resource using the `description` property. This description appears when the resource is selected in the diagram.

```yaml
resources:
- name: Resource A
  description: This is a single-line description
```

--------------------------------

### Configure Resource Icons in Ilograph

Source: https://www.ilograph.com/docs/editing/icons

The 'icon' property allows users to assign visual representations to resources. This snippet demonstrates the various ways to reference icons, including built-in libraries, local files, remote URLs, and workspace-specific assets.

```Ilograph
icon: AWS/Compute/EC2.svg
icon: myIcon.webp
icon: icons/company.webp
icon: https://www.ilograph.com/img/icon.png
```

--------------------------------

### Combine Ancestor and Descendant References in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code shows how to combine relative references to ancestor resources ('../') with references to descendant resources (using '//'). This allows for flexible path definitions within the resource tree.

```yaml
to: ../..//Resource
```

--------------------------------

### Group Perspectives in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/perspective-groups

Demonstrates how to organize perspectives by prepending a group name followed by double forward slashes. This syntax allows for both flat and nested hierarchical structures in the perspective tray.

```YAML
perspectives:
- name: Group name//Perspective name
  ...
```

```YAML
perspectives:
- name: Group name//Sub-group Name//Perspective name
  ...
```

--------------------------------

### Ilograph Team Workspace API - Diagram Operations

Source: https://www.ilograph.com/docs/team-workspace-api

Details on how to perform operations on diagrams using the Ilograph Team Workspace API, including supported HTTP methods and request URL structure.

```APIDOC
## Ilograph Team Workspace API - Diagram Operations

### Description
This section outlines how to interact with your workspace diagrams using the Ilograph API. You can retrieve, update, and check the modification status of diagrams.

### API Request URLs
API calls are made to the following base URL structure:
`https://api.ilograph.com/m0/@TeamName/path/to/diagram`

- `https://api.ilograph.com/m0/`: The base API endpoint.
- `@TeamName`: Your team workspace name, prefixed with `@`.
- `path/to/diagram`: The path to the specific diagram within your workspace.

### Supported Methods

#### GET
**Method**: GET
**Description**: Retrieves the content of a diagram. Requires read permissions.

#### PUT
**Method**: PUT
**Description**: Updates an existing diagram. The diagram's content should be provided as plain text YAML in the request body. Requires write permissions. Note: This method cannot create or delete diagrams.
**Request Body**: Plain text YAML content of the diagram.

#### HEAD
**Method**: HEAD
**Description**: Returns an empty body but includes the `Last-Modified` header, allowing you to check if a diagram has been updated. Works with either read or write permissions.

### Request Example (GET Diagram)
```json
{
  "example": "GET https://api.ilograph.com/m0/@YourTeamName/path/to/your/diagram"
}
```

### Request Example (PUT Diagram)
```json
{
  "example": "PUT https://api.ilograph.com/m0/@YourTeamName/path/to/your/diagram\nContent-Type: text/plain\naccessKey: YOUR_ACCESS_KEY\n\n# Your diagram YAML content here..."
}
```

### Response (Success - GET)
#### 200 OK
- **Diagram Content** (string) - The YAML content of the diagram.

### Response Example (Success - GET)
```json
{
  "example": "# Diagram YAML content..."
}
```

### Response (Success - HEAD)
#### 200 OK
- **Last-Modified** (string) - The date and time the diagram was last modified.

### Error Handling
- Requests without a valid `accessKey` header will be denied.
- Requests originating from an IP address not on the allow-list will be denied.
- Attempting to create or delete diagrams via the API will result in an error.

For support, please contact support@ilograph.com.
```

--------------------------------

### Control Resource Order by Reference

Source: https://www.ilograph.com/docs/editing/perspectives/resource-sizes-and-positions

In Ilograph relation perspectives, the order in which resources are first referenced determines their top-to-bottom position when they appear in the same column. Resources referenced earlier are displayed above those referenced later. This applies to single and multiple references.

```yaml
perspectives:
- name: Dependency
  defaultArrowLabel: Read/Write
  relations:
  - from: Service A
    to: Data Store X

  - from: Service B
    to: Data Store X
```

```yaml
perspectives:
- name: Dependency
  defaultArrowLabel: Read/Write
  relations:
  - from: Service A, Service B # By appearing first, "Service A" will be rendered above "Service B"
    to: Data Store X
```

--------------------------------

### Reference Imported Perspectives in Ilograph

Source: https://www.ilograph.com/docs/editing/imports

Illustrates how to use imported perspectives in Ilograph. Imported perspectives are hidden by default and must be extended using the `extends` property, referencing them with `namespace::PerspectiveName`.

```yaml
imports:
- from: myUsername/myImportedDiagram
  namespace: MyImportedDiagram

perspectives:
- name: A Perspective
  extends: MyImportedDiagram::AnImportedPerspective
```

--------------------------------

### Define Explicit Routing Relations in Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code explicitly defines routing relationships between Firewalls and Load Balancers for each individual system (System 1, System 2, System 3). This method is clear but becomes repetitive as the number of systems increases.

```yaml
perspectives:
- name: Routing
  relations:
  - from: System 1/Firewall
    to: System 1/Load Balancer
    
  - from: System 2/Firewall
    to: System 2/Load Balancer
    
  - from: System 3/Firewall
    to: System 3/Load Balancer
```

--------------------------------

### Use Relative References in 'Via' Property with Ilograph

Source: https://www.ilograph.com/docs/editing/perspectives/advanced-references

This code demonstrates using relative references within the 'via' property of a relation in Ilograph. It shows how to reference resources relative to both the 'from' and 'to' endpoints using '../' and '.../' respectively.

```yaml
perspectives:
- name: Routing
  relations:
  - from: [Client]
    to: [Server]
    via: ../[Firewall], .../[Firewall]
    ...
```

--------------------------------

### Reference Imported Resources in Ilograph

Source: https://www.ilograph.com/docs/editing/imports

Shows how to reference imported resources within an Ilograph diagram after declaring an import. Imported top-level resources are accessed using the defined `namespace` followed by `::` and the resource name.

```yaml
imports:
- from: myUsername/myImportedDiagram
  namespace: MyImportedDiagram

perspectives:
- name: A Perspective
  relations:
  - from: SomeResource
    to: MyImportedDiagram::AnImportedResource
```

--------------------------------

### Declare Imports in Ilograph

Source: https://www.ilograph.com/docs/editing/imports

Demonstrates how to declare imports in an Ilograph source file. Imports are defined under the top-level `_imports_` property, requiring `from` and `namespace` properties. The `namespace` must be unique and cannot contain restricted characters.

```yaml
imports:
- from: myUsername/myImportedDiagram
  namespace: MyImportedDiagram
```
Tokens:
Raw