# Creating a chart from Excel

## Introduction

Since the Chart.js for Confluence app reads the information from tables, it is fairly simple to use an Excel table and copy it over to Confluence into a chart macro. Here is an example for a Bar Chart.

**1. Prepare the table in Excel**

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2Fv1Xw2V0OSCz0moge2upZ%2Fexcel-table-768x488.jpg?alt=media&#x26;token=96602c51-34e1-4d10-aa57-d5a602021808" alt=""><figcaption></figcaption></figure>

**2. Select and copy the table**

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2F3QfLqUZnoHDLVyplpgnY%2Fexcel-table-select-and-copy-768x462.jpg?alt=media&#x26;token=009ffcb0-b2a6-4e8e-9d78-ab073a8e2e63" alt=""><figcaption></figcaption></figure>

#### 3. Edit your Confluence page and insert a Chart.js Bar Chart macro

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2FiJ9NwIJ9u24KBv5IvTa3%2Fadd-bar-chart-macro-768x487.jpg?alt=media&#x26;token=83629fe6-45a9-4421-b8e7-831723e11c45" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2Fgs4rOfKHY6wBlYCzzLi1%2Fadd-bar-chart-macro-2-768x484.jpg?alt=media&#x26;token=a36225ea-8c46-466f-9882-6a450bd52fa7" alt=""><figcaption></figcaption></figure>

#### 4. Paste the Excel table from the clipboard into the macro body

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2F5j1MtZciKrwlj3mrtaSG%2Finsert-excel-table-768x486.jpg?alt=media&#x26;token=32dcee02-5c7f-4e5b-8ebd-140804a204c2" alt=""><figcaption></figcaption></figure>

#### 5. Insert a 2nd and a 3rd column

The macro expects these two columns. They allow you to specify the type and color of the data series in each row.

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2Felfjn1oGTXuSbXzg8U0V%2Finsert-two-columns-768x485.jpg?alt=media&#x26;token=dc55273a-5a17-4b9e-8910-f0613529d0ea" alt=""><figcaption></figcaption></figure>

#### 6. Publish your page

At this point you can already publish your page. Even though you haven’t specified type and color. The macro will use defaults and random colors.

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2FueXnYfUTTPWpS4KDM73y%2Fpublish-random-768x483.jpg?alt=media&#x26;token=8f175aa4-5ac9-44bb-bfe5-ed23b3e99e49" alt=""><figcaption></figcaption></figure>

#### 7. Edit your page again and fine tune your chart

You can go back to your macro and specify more details.

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2FUTJ44ZWWWK6BLsgmLcXk%2Fedit-type-and-color-768x488.jpg?alt=media&#x26;token=205ad268-40ca-408d-9c5e-19831b0d2ed0" alt=""><figcaption></figcaption></figure>

#### 8. Final result after publish

<figure><img src="https://3051033766-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FApLUVcHft8fNvUzjMhGm%2Fuploads%2F0KIBWKid7NRSWhwlX6FD%2Fpublish-type-and-color-768x485.jpg?alt=media&#x26;token=4b51fb47-cc5b-47af-be5e-3998af788d65" alt=""><figcaption></figcaption></figure>