> For the complete documentation index, see [llms.txt](https://docs.getinfinity.app/user-guide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.getinfinity.app/user-guide/comprehensive-user-guide/2.-charts/chart-customization/customizing-chart-with-advanced-editor-panel.md).

# Customizing Chart with Advanced Editor Panel

The **Advanced Editor** provides additional customization and control over chart settings.&#x20;

#### **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.
