# Customizing Chart with Advanced Editor Panel

The **Advanced Editor** provides additional customization and control over chart settings. 

#### **How to Access the Advanced Editor**

1. Click on the **Advanced Editor** button on the chart.
2. Navigate through the four sections to customize settings.
3. Make changes as needed and click **Apply** to save modifications.
4. For JavaScript customizations, ensure code is correctly formatted before applying changes.

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

It is divided into four main sections:

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

#### 1. **Styles**

* Allows users to customize chart styles.
* Various customization options are available depending on the chart type.
* Users can modify elements such as **background, titles, legends, grid, axes, and series styles**.
* This menu dynamically adapts based on the selected chart type.

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

#### 2. **Sharing**

* Enables setting permissions for different users.
* Users can define **who can view and who can edit** the chart.
* Permission settings can be applied at an **individual, role-based, or organizational level**.
* A modal appears where users can select **read-only or edit access** for different users.<br>

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

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

#### 3. **Prompts**

* This section allows users to define **custom AI prompts** specific to the chart.
* It consists of **three subsections**:
  1. **Chatbot Prompt**: Users can add background details and necessary information that AI can use to answer user questions more effectively.
  2. **Summary Prompt**: Provides AI with background information to generate narrative or summary-type responses.
  3. **Delta-Feed**: Defines **what changes AI should track in the chart**. Users can add conditions, and AI will monitor them for **material changes**, triggering notifications or updates in the feed.

<figure><img src="/files/4rDFTB25aRQnJUHZlwEK" alt=""><figcaption></figcaption></figure>

#### 4. **JS (JavaScript) Mode**

* Designed for **developers and technical users** who need advanced control over chart rendering.
* Allows users to **edit and modify JavaScript code** related to the chart.
* Users can customize chart behavior, tooltips, legends, and interactions.
* Changes can be saved and applied via the **"Apply" button**.
* **Note**: The system **does not have the capability to dynamically fix JavaScript errors**. Users should refer to the [**separate section on JavaScript tips** f](#id-4.-js-javascript-mode)or guidance on debugging and best practices.

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

The **Advanced Editor** is a powerful tool for users who require deeper customization, permissions control, AI-driven insights, and developer-level modifications to charts.


---

# 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.getinfinity.app/user-guide/comprehensive-user-guide/2.-charts/chart-customization/customizing-chart-with-advanced-editor-panel.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.