# Tables

## What are tables?

As a way to visually present data, tables are a popular method for conveying information. Arranging data in rows and columns enables users to easily compare and analyze data patterns and understand the connections between them.

### Learn more about

<table data-view="cards"><thead><tr><th></th><th data-hidden data-card-cover data-type="files"></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td>Scorecard</td><td><a href="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FuvxWuJ2bs21zD3Rn3wxe%2FScorecard.svg?alt=media&#x26;token=f46c2448-6089-4bcb-a065-a4628036fe6d">Scorecard.svg</a></td><td><a href="tables/scorecard">scorecard</a></td></tr><tr><td>Data Table</td><td><a href="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FTHZDQxOgETV7aKeAApPA%2FDataTable.svg?alt=media&#x26;token=673b0f43-e7c0-4485-aa87-1aebdc6dc33c">DataTable.svg</a></td><td><a href="tables/data-table">data-table</a></td></tr><tr><td></td><td></td><td></td></tr></tbody></table>

### Plotting data on a Table

To bind data to a Table, data must be structured in a block format.&#x20;

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FHFblgcmC9wsOnMRymcpV%2Fimage.png?alt=media&#x26;token=9ec9f777-6e1c-4db3-afd5-faaaa9ebc974" alt=""><figcaption><p>A basic table structure, with rows or data and column headers along the top.</p></figcaption></figure>

1. Place a table component on the canvas. There are two types:
   1. [**Scorecard**](https://learn.squirrel365.io/components-functions-and-connections/overview/tables/scorecard) **-** a table component with more styling options and functionality.
   2. [**Data Table**](https://learn.squirrel365.io/components-functions-and-connections/overview/tables/data-table) - a table that captures the spreadsheet and displays it on the canvas, including formatting and styling.
2. Expand the **GENERAL** section of the component properties panel
3. Select the 'Bind to spreadsheet' ![](https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FZIctFaaVbNdAt6Su1j3J%2Fimage.png?alt=media\&token=433bb282-31ee-42ec-a119-8cad440cbf38) button (visible when hovering over the 'Data to Display' input) - the spreadsheet will expand.
4. Select the table range in the spreadsheet and click 'Confirm'

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FJYiKQTG89Q0lfdxEYyZK%2Fimage.png?alt=media&#x26;token=ab283296-5b0a-47f9-8e24-32e451ac48fe" alt=""><figcaption></figcaption></figure>

After hitting confirm, the table will now display the data in the spreadsheet.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FDasjUk6YfhtmPI2YZRRC%2Fimage.png?alt=media&#x26;token=7baf6091-302e-49ca-a0b0-44c8251845de" alt=""><figcaption></figcaption></figure>

The table will use some default styling and number formatting, but with a few changes, it can go from this (above) to this (below).

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2F3JyzGFSpGJ96gD1zxUU0%2Fimage.png?alt=media&#x26;token=bc78ab2c-26fb-43cb-8fa5-f673ff4db8ee" alt=""><figcaption></figcaption></figure>