> ## Documentation Index
> Fetch the complete documentation index at: https://docs.omni.co/llms.txt
> Use this file to discover all available pages before exploring further.

# Working with dashboard charts

> Add, edit, duplicate, hide, and configure chart tiles on Omni dashboards, including filter connections and background settings.

export const CheckIcon = ({label}) => {
  return <span>
      <Icon icon="circle-check" iconType="solid" color="#26bd6c" />
      {label && ` ${label}`}
    </span>;
};

export const XCircleIcon = ({label}) => {
  return <span>
      <Icon icon="circle-xmark" iconType="solid" color="#ff2465" />
      {label && ` ${label}`}
    </span>;
};

export const MarkdownVariablesIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M3 12v-7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-7"></path><path d="M3 10h18"></path><path d="M10 3v10"></path><path d="M2 17a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1v-4z"></path></svg>
    </span>;
};

export const DashboardIcon = ({label}) => {
  return <span>
      <svg fill="none" height="1em" strokeWidth="2" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M12.5625 3V21M12 9.75H3M21 15.375H12.5625M7 21H17C19.2091 21 21 19.2091 21 17V7C21 4.79086 19.2091 3 17 3H7C4.79086 3 3 4.79086 3 7V17C3 19.2091 4.79086 21 7 21Z" stroke="currentColor"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const WorkbookIcon = ({label}) => {
  return <span>
      <svg fill="none" height="1em" stroke-width="2" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M9.1875 3V15.375M21 15.375H3M7 21H17C19.2091 21 21 19.2091 21 17V7C21 4.79086 19.2091 3 17 3H7C4.79086 3 3 4.79086 3 7V17C3 19.2091 4.79086 21 7 21Z" stroke="currentColor"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const WorkbookNumberFormatIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 30 30" stroke-linecap="round" stroke-linejoin="round" height="1.75em" width="1.75em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M8 10v-7l-2 2"></path><path d="M6 16a2 2 0 1 1 4 0c0 .591 -.601 1.46 -1 2l-3 3h4"></path><path d="M15 14a2 2 0 1 0 2 -2a2 2 0 1 0 -2 -2"></path><path d="M6.5 10h3"></path></svg>
    </span>;
};

export const DashboardPreviewIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M3 16m0 1a1 1 0 0 1 1 -1h3a1 1 0 0 1 1 1v3a1 1 0 0 1 -1 1h-3a1 1 0 0 1 -1 -1z"></path><path d="M4 12v-6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-6"></path><path d="M12 8h4v4"></path><path d="M16 8l-5 5"></path></svg>
    </span>;
};

export const DashboardCatalogIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M10 19h-6a1 1 0 0 1 -1 -1v-14a1 1 0 0 1 1 -1h6a2 2 0 0 1 2 2a2 2 0 0 1 2 -2h6a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-6a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2z"></path><path d="M12 5v16"></path><path d="M7 7h1"></path><path d="M7 11h1"></path><path d="M16 7h1"></path><path d="M16 11h1"></path><path d="M16 15h1"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardAddItemIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z"></path><path d="M4 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z"></path><path d="M14 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z"></path><path d="M14 7l6 0"></path><path d="M17 4l0 6"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardControlIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M3 3m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z"></path><path d="M3 11l8 -8"></path><path d="M3 17l14 -14"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardChartIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M3 3v18h18"></path><path d="M20 18v3"></path><path d="M16 16v5"></path><path d="M12 13v8"></path><path d="M8 16v5"></path><path d="M3 11c6 0 5 -5 9 -5s3 5 9 5"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardPlaceholderIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z"></path><path d="M14 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z"></path><path d="M4 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z"></path><path d="M14 17h6m-3 -3v6"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardLayoutIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M4 7l16 0"></path><path d="M4 17l16 0"></path><path d="M7 4l0 16"></path><path d="M17 4l0 16"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardTextIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M4 20l3 0"></path><path d="M14 20l7 0"></path><path d="M6.9 15l6.9 0"></path><path d="M10.2 6.3l5.8 13.7"></path><path d="M5 20l6 -16l2 0l7 16"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardStackContainerIcon = ({label}) => {
  return <span>
      <svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M4 5C4 4.73478 4.10536 4.48043 4.29289 4.29289C4.48043 4.10536 4.73478 4 5 4H19C19.2652 4 19.5196 4.10536 19.7071 4.29289C19.8946 4.48043 20 4.73478 20 5V9C20 9.26522 19.8946 9.51957 19.7071 9.70711C19.5196 9.89464 19.2652 10 19 10H5C4.73478 10 4.48043 9.89464 4.29289 9.70711C4.10536 9.51957 4 9.26522 4 9V5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><path d="M4 15C4 14.7348 4.10536 14.4804 4.29289 14.2929C4.48043 14.1054 4.73478 14 5 14H12C12.2652 14 12.5196 14.1054 12.7071 14.2929C12.8946 14.4804 13 14.7348 13 15V19C13 19.2652 12.8946 19.5196 12.7071 19.7071C12.5196 19.8946 12.2652 20 12 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V15Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const DashboardPageNavIcon = ({label}) => {
  return <span>
      <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M4 8h16"></path><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M8 4v4"></path></svg>
      {label && ` ${label}`}
    </span>;
};

export const IdeFileIcon = ({color = "#000000"}) => {
  return <span>
      <svg stroke={color} fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="file-type-icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg" style={{
    display: "inline",
    verticalAlign: "middle"
  }}><path d="M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z"></path><path d="M3 10h18"></path><path d="M10 3v18"></path></svg>
    </span>;
};

Chart tiles display the visualizations from your workbook queries on the dashboard. You can edit chart settings inline, hide tiles from viewers, copy them to other dashboards, and inspect the underlying queries.

## Editing charts

How you edit charts on a dashboard depends on the type of dashboard you're using:

<Tabs>
  <Tab title="New dashboard editor">
    When you select a chart item on a dashboard, the [properties panel](/visualize-present/dashboards/containers-items#accessing-the-properties-panel) will show chart settings inline, allowing you to edit visualization configuration without leaving the layout editor.

    In the properties panel, you can edit the chart's:

    * Title, subtitle, and description
    * Visualization type
    * Visualization settings such as colors, axes, stacking, and other display options

    Changes are saved automatically as you work.

    For more advanced editing capabilities, click the **Edit in workbook** button at the top of the properties panel. This opens the chart in the workbook where you have full configuration options for the visualization.
  </Tab>

  <Tab title="Classic dashboard editor">
    <Note>
      See [Upgrading classic dashboards](/visualize-present/dashboards/create#classic-dashboards) to learn how to upgrade your classic dashboard.
    </Note>

    To edit a chart on a classic dashboard, click the <Icon icon="ellipsis-vertical" type="solid" /> icon in the right corner of the tile. Then, click **Edit chart** to edit the chart on the dashboard or **Edit in workbook** to edit the chart in the workbook.
  </Tab>
</Tabs>

<Note>
  If your dashboard has filters and you're editing a chart in a workbook, note that workbook results may differ from what's on the dashboard. This is because dashboard filters aren't applied to workbook queries.
</Note>

### Adding chart subtitles and descriptions

Editing a chart on the dashboard allows you to add an optional subtitle and description to the chart.

To have Omni's AI write the subtitle or description, click the <Icon icon="star" /> icon and toggle **Let AI write the subtitle/description** to on.

You can also provide additional context to the AI to guide the results.

## Inserting query text items

Query text items display your query's name, subtitle, description, or AI-generated summary as dashboard content that maintains a live binding to the source query. Unlike static text tiles, query text items automatically update when you change the query's metadata in the workbook.

This is useful when you want dashboard titles, descriptions, or context to stay synchronized with query changes without manual updates.

To insert query text:

1. Right-click a chart tile in a container.
2. Select an option:
   * **Insert query text** - Insert the query's **title**, **subtitle**, **description**, or **All available**
   * **Insert AI summary** - Insert an inline or tooltip AI summary of the query. Use the properties panel to add additional context to the summary.
   * **Insert results** - Insert a table of the query's results

The insert behavior varies based on [container type](/visualize-present/dashboards/containers-items#containers):

| Type                                      | Description                                                                                                                                                  |
| ----------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| <Icon icon="grid-2" /> **Grid**           | The new item is inserted above the target item at the same horizontal position and width. Any overlapping items are automatically pushed down to make space. |
| <DashboardStackContainerIcon /> **Stack** | The new item is inserted before (above or to the left of) the target item in the stack's flow direction.                                                     |

<h3 id="convert-to-text">
  Converting metadata to editable text
</h3>

Convert metadata items and AI summaries to editable text (or vice versa) by right-clicking on the chart and selecting **Convert to**:

<Frame caption="Convert submenu for query metadata and AI summary items">
  <img src="https://mintcdn.com/omni-e7402367/l91N7nvXerc-ZOFK/visualize-present/images/advanced-dashboards-query-metadata-convert.png?fit=max&auto=format&n=l91N7nvXerc-ZOFK&q=85&s=ad1728ec4f99eb9ddefd712f1c18a409" alt="Convert submenu for query metadata and AI summary items" width="673" height="316" data-path="visualize-present/images/advanced-dashboards-query-metadata-convert.png" />
</Frame>

Then, select the target:

* **Markdown text** - Converts the metadata item to a text tile with a [Mustache template](/visualize-present/dynamic-content) (e.g., `{{queries.<id>.name}}`) that preserves live binding to the query
* **AI summary** - Converts an editable text item to an AI-generated summary

Converting to editable text allows you to customize the presentation while maintaining the connection to the source query through template variables.

## Hiding charts

In some cases, you may not want charts to be visible on the dashboard. The underlying data may be important for the workbook, but you don't want viewers to interact with the data. Other dashboard queries, however, can still access hidden tiles (with `XLOOKUP`).

<Note>
  Charts that are excluded from the dashboard will not run on the dashboard unless they are invoked by another query (i.e. XLOOKUP, alert, or used in a filter).
</Note>

<Tabs>
  <Tab title="New dashboard editor">
    Click the chart on the dashboard to open the properties panel. Then click the <Icon icon="trash" /> icon to remove it from the dashboard.

    Removing the chart in this way doesn't delete the underlying workbook query - it only removes the chart from the dashboard.
  </Tab>

  <Tab title="Classic dashboard editor">
    To hide a chart on a classic dashboard, click the **Charts** button near the top left corner of the page. This opens a panel on the left where you can manage the visibility of charts on the dashboard. Deselect a chart to exclude it from the dashboard:

    <img src="https://mintcdn.com/omni-e7402367/oGCuLRc1tzwBfNtv/visualize-present/images/update-excluding-tiles.png?fit=max&auto=format&n=oGCuLRc1tzwBfNtv&q=85&s=dddada551e67ca0da249113e30727ece" alt="" width="1948" height="1286" data-path="visualize-present/images/update-excluding-tiles.png" />
  </Tab>
</Tabs>

## Copying charts and links

On a chart, click the <Icon icon="ellipsis-vertical" type="solid" /> icon that displays. Then, select **Copy** to view options for copying charts and links:

* **To another dashboard or workbook**: Copy the tile to a different dashboard or workbook. This works similarly to [copying a workbook tab to an existing workbook](/analyze-explore/workbook-basics#copy-a-tab-to-an-existing-workbook).
* **Link to workbook tab**: Copy a direct link to the tile's underlying workbook tab to your clipboard

## Interacting with table tiles

Dashboard tiles containing table visualizations support spreadsheet-style selection, copying, and cell interaction. Dashboard tables are read-only — editing, column reordering, and calculation features are only available in [workbook tables](/analyze-explore/point-click-queries#interacting-with-tables).

For a full list of keyboard shortcuts, see [Table shortcuts](/getting-started/keyboard-shortcuts#table-shortcuts).

### Selecting cells

* **Click** a cell to select it
* **Click and drag** across cells to select a rectangular region
* **Shift+click** a cell to select a range from the anchor to the clicked cell
* **Command+click** (Mac) or **Ctrl+click** (Windows) a cell to add or remove it from your selection
* **Click a row number** to select an entire row. Combine with **Shift** to extend the selection or **Command/Ctrl** to toggle the row.
* **Click a column header** to select an entire column. Combine with **Shift** to extend the selection or **Command/Ctrl** to toggle the column.
* **Arrow keys** to move the focused cell. Hold **Shift** to extend the selection.
* **Command+A** (Mac) or **Ctrl+A** (Windows) to select all cells
* **Escape** or **click outside** the table to clear the selection

### Copying cells

Select one or more cells, then press **Command+C** (Mac) or **Ctrl+C** (Windows) to copy the selected values to your clipboard. Copied data uses a tab-separated format, so pasting into Excel or Google Sheets automatically places values into the correct cells.

When all cells are selected with `Command` + `A` / `Ctrl` + `A`, column headers are included in the copied output.

### Context menu

Right-click a cell to open a context menu with options to drill, filter, copy, or expand the cell value.

## Inspecting chart queries

You can quickly access SQL debugging information for a chart by using the **Inspect** option. This opens the underlying workbook with the [Inspector panel](/analyze-explore/workbook-inspector) pre-opened, allowing you to view query SQL, cache status, and execution details.

To inspect a chart, click the <Icon icon="ellipsis-vertical" type="solid" /> (three dots icon) in the right corner of the tile, then click **Inspect**.

This feature requires the necessary permissions to analyze data and query SQL. For more information about viewing generated SQL, see [Inspecting query SQL](/analyze-explore/sql/generation#inspecting-query-sql).
