---
title: "Enable interactive charts"
slug: "/help/demos/edit/content/interactive-charts"
last_updated: "2025-06-12T17:32:26Z"
zendesk_id: 32070786748051
zendesk_url: "https://help.walnut.io/hc/en-us/articles/32070786748051-Enable-Interactive-Charts"
locale: "en-us"
category: "Explore Walnut "
section: "Advanced Editing"
product: "demos"
topic: "edit/content"
displayed_sidebar: "demosSidebar"
sidebar_position: 26
tags: ["editing","chart.js","charts","interactive charts","highcharts","edit charts","chart editing"]
---

## **About This Feature**

Walnut supports **interactive chart libraries** to help you create dynamic, data-rich demos that are easy to edit and customize.

When using a [supported chart library](/help/demos/getting-started/chrome-extension-tutorial), you’ll be able to **modify chart labels**, **data points**, **tooltips**, **axis values**, and more—directly within the Walnut Editor.

### **Snapshot 📸**

-   **Feature Status:** Core Feature
-   **Role Access:** Admins, Editors
-   **Location:** Walnut Editor

## **Quick Start Guide**

:::note[Important to Note]

-   **Interactivity and Editing** are only available for [supported libraries and versions](/help/demos/getting-started/chrome-extension-tutorial).
-   **Unsupported versions or libraries** will appear as static images or SVGs in captures and will not support label, value, or style editing within the Walnut Chart Editor.
-   **Chart or tooltip styling** might look slightly different in the Walnut Editor depending on how the chart was embedded on your platform—for example, if it uses dynamic rendering, third-party tools, or custom design tweaks (outside of those provided by the chart library).

:::

1.  Click on a captured chart element in the Walnut Editor. If interactivity and editing are supported, a **grey pie chart icon** will appear in the upper left corner of the chart.
    
    ![Captured chart in Walnut Editor with interactivity icon highlighted.](pathname:///images/c15a18b837ac5c78.png)
    
2.  Click the **Activate Chart Interactivity** icon in the element editor toolbar to enable interactivity and editing features.
    
    ![Toolbar showing the Activate Chart Interactivity button.](pathname:///images/d570526258da84f3.png)
    
3.  Click **Edit Chart** to open the chart editor interface.
    
    ![Chart editor with Edit Chart button visible.](pathname:///images/4b04a93bfe654540.png)
    
    ![Left panel of chart editor showing data points.](pathname:///images/561deb51f0a7e421.png)
    
4.  Select a **data point value** or **label** in the left panel to begin editing.
    
    ![Chart point value selected for editing.](pathname:///images/7f449150c2d7b9e3.png)
    
    ![Legend label highlighted for editing in chart.](pathname:///images/f8ed73782a6ce108.png)
    
5.  Click the **gear icon** in the top-right of the chart editor to access advanced options for tooltips, axis, and plot style settings.
    
    ![Chart editor settings gear icon for advanced options.](pathname:///images/1115f21579a64fe3.png)
    
6.  Click **Save** to apply your changes.
7.  To reset the chart to its original captured state, select the chart, open the three-dot menu in the toolbar, and click **Reset Changes**.
    
    ![Reset Changes option in the three-dot menu of the element editor.](pathname:///images/d6c8c5caa5165889.png)
    

### **Supported Chart Libraries**

For framework compatibility and interactivity support, check the full list of supported chart libraries in our [Extension Capabilities](/help/demos/getting-started/chrome-extension-tutorial) article.

## **FAQs**

---

**Can I Add Dynamic Date Variables or Other Variables to My Charts?**

-   No — at this time, **charts do not support dynamic variables** such as dates, text, or images. All chart content must be static and manually configured.
    

---

**The Interactivity Option Isn’t Showing, but I’m Using a Supported Library and Framework. What Should I Do?**

-   If the interactivity icon isn’t appearing—even though your chart uses a supported library and framework—there may be an issue with how the chart was captured or rendered. [Reach out to our Support Team](https://help.walnut.io/hc/en-us/requests/new?ticket_form_id=4955821960979), and we’ll be happy to help troubleshoot.
    

---