# Appendix: Common Components

### The Chart Component

<figure><img src="/files/YvvYJxhQTIfF0tbsNBpE" alt=""><figcaption><p>Fig1: Chart Component View</p></figcaption></figure>

The chart component is used to graph data against time. There are 2 main features that can help you get better view of the data

1. **Point Viewer**

<figure><img src="/files/JwyXB5KHncqGDNwPzBfn" alt=""><figcaption><p>Fig2: Point Viewer</p></figcaption></figure>

When you move the cursor towards a point in the chart, you can view all the information related to this point in the graph, including the values of the X and Y axis.

2. **Time Range Selector**

<figure><img src="/files/6vvN6x0vqMypGd73vauu" alt=""><figcaption><p>Fig3: Time Range Selector</p></figcaption></figure>

You can change the number of data points viewed in the graph by selecting the desired time range as shown in the GIF above.

### The Paginated Table Component

<figure><img src="/files/jDOeUDgN1LoL940R0SFY" alt=""><figcaption><p>Fig4: Paginated table component</p></figcaption></figure>

Paginated table is a tabular view of a list of data items, organized in pages, to decrease load time. You can use the arrows in the bottom right of the table to move between pages as shown in the GIF below.

<figure><img src="/files/TFVi2aMcTgXJrtshYlkP" alt=""><figcaption><p>Fig5: Table pagination arrows</p></figcaption></figure>

If you hover over the "i" icon next to the name of each column, you'll get more info about this column

<figure><img src="/files/jr1gtAeoGFYVRizGKx6i" alt=""><figcaption><p>Fig6: The "i" icon</p></figcaption></figure>

Sometimes, you can have a Download button in the top right corner of the table, which can be clicked so you can download the viewed page to your local machine in CSV format.

<figure><img src="/files/xjaWSRwYURjbPx19u82o" alt=""><figcaption><p>Fig7: Download button</p></figcaption></figure>


---

# 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.zus.network/zus-docs/webapps/atlus/appendix-common-components.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.
