> For the complete documentation index, see [llms.txt](https://docs.diaflow.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.diaflow.io/workflow-builder/nodes/outputs-apps/chart-output.md).

# Chart output

Chart output shows chart-ready data from an earlier node as a visual in your app.

Use it when people need a quick visual view of business results.

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

### Before you start

Choose a field from an earlier node that returns chart-ready data.

If your data is not ready yet, use [Convert JSON to Chart Data](/workflow-builder/nodes/built-in-tools/convert-json-to-chart-data.md) first.

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

### How to set it up

1. In the **Output** node, click **+ Add**.
2. Select a field with chart-ready data from the list of earlier nodes.
3. Click **Ok**.
4. Choose **Chart** as the output type.
5. Enter a clear **Title**.
6. Click **Ok** and test the flow.

### Settings

| Setting     | What it does                                                                            |
| ----------- | --------------------------------------------------------------------------------------- |
| Output type | Sets how the selected field is shown in the app. Choose **Chart** for chart-ready data. |
| Title       | The label shown above the chart, such as `Sales by month`.                              |

### Good business uses

* Show sales trends over time.
* Compare team or region performance.
* Summarize survey results visually.

### Next steps

* Go back to [Outputs (Apps)](/workflow-builder/nodes/outputs-apps.md).
* Prepare chart-ready data with [Convert JSON to Chart Data](/workflow-builder/nodes/built-in-tools/convert-json-to-chart-data.md).
* Compare it with [Text output](/workflow-builder/nodes/outputs-apps/text-output.md).