How to visualize Airtable data with Chartbrew
5 min read

How to visualize Airtable data with Chartbrew

Airtable is a popular data source that integrates with a myriad of other tools. Visualize this data with Chartbrew to get useful insights for your business.
How to visualize Airtable data with Chartbrew

In this tutorial, we are going to create an Airtable connection in Chartbrew and visualize the data. We are going to use an Airtable template already created for this tutorial. The data contains pageviews and visitor data from Chartbrew's Simpleanalytics dashboard.

If you are not using Chartbrew currently, you can get started in two ways:

Get the tutorial Airtable data

To get started, click the link below to access the data we will use for this tutorial:

Airtable | Everyone’s app platform
Airtable is a low-code platform for building collaborative apps. Customize your workflow, collaborate, and achieve ambitious outcomes. Get started for free.

Once there, you'll have to duplicate the data in one of your Airtable spaces. Click on the title of the document and then select "Duplicate base".

Duplicate base in Airtable for Chartbrew

Awesome! Now that we have a base, we can go ahead and connect Airtable to Chartbrew.

Create an Airtable connection in Chartbrew

Create a new project or use an existing one in Chartbrew. Head over to the Connections screen and create a new API connection.

Connect to any API in Chartbrew

We have to complete the API form with the Airtable connection details:

The bearer token field has to be filled with your Airtable API key. You can get yours from the account page here.

Airtable API key for connecting to Chartbrew

Copy the API key in the Bearer token field and save the connection. If you test the connection you should get a "404, not found" error, but that is to be expected since we are trying to get data from the root API URL.

Creating an Airtable connection in Chartbrew

Create a time series chart with Airtable data

Next, we are going to create a time series chart that looks like this:

Click on the "Create a new chart" button in the sidebar menu and let's get started with building our first Airtable chart!

Airtable charts in Chartbrew

Our Airtable data contains two tables. One with the number of visitors on different days and the other one with the number of page views. Our goal is to plot this data in a line chart with two datasets. Create a new dataset called "Visitors", select the newly created Airtable connection, and click on the request button.

Get Airtable data in Chartbrew

To know how to complete the request, we have to get the right API endpoint from Airtable. Head over to the Airtable API docs and select your new base.

Preparing Airtable base for the Chartbrew integration

Once there, you will see both "visitors" and "pageviews" tables in the side menu. To start, select the Visitors Table and click on "List records". The left view will show you how to request data. Copy the bit after the root of the API endpoint as shown in the picture below.

curl request to get Airtable data in Chartbrew

We can now paste this part of the URL in Chartbrew to match the URL shown in the Airtable docs. You can delete the "maxRecords=3" bit since we want to get all the data. After you do that, press on the "Run the request" button and you should get the data in a JSON format in the left section.

Airtable JSON data in Chartbrew

Now that we have the data coming in, we can go ahead and visualize it. Click on the "Build the chart" button and prepare the X-Axis and Y-Axis so that Chartbrew knows how to plot the data. Our goal is to show the number of visitors per day. We need the "date" field on the X-Axis and the "visitors" number on the Y-Axis. Also, we don't need to apply any operation on the Y-Axis because the number of visitors is already aggregated.

Plotting Airtable data in a line chart in Chartbrew

Great! We have a nice time series chart showing the number of visitors per day. Now let's add the number of page views on this chart as well. We have to do the same steps, but instead of the Visitors Table, we need to get the right URL for the Pageviews Table.

  1. In Chartbrew, create a new dataset called "Pageviews"
  2. Head over to the Airtable API docs to get the right URL, but click on the "Pageviews table" instead
  3. Configure the X-Axis and Y-Axis in the same way as we did for the visitors
Multiple tables plotted in Chartbrew

And here we go, we have a time series chart plotted with data from Airtable! Feel free to connect any of your tables to Chartbrew and you can have live visualizations of your data. It works with dynamic data since Chartbrew can be configured to keep your visualizations up-to-date.

Chartbrew dashboard view

Next steps

Charts and dashboards in Chartbrew have extra features that you can play around with. Some things you can do moving forward:

  • Set your charts to auto-update so you get fresh data from your Airtable source
  • Embed your charts on external sites like Notion, Blogs, Personal websites, etc
  • Create a public dashboard and share your unique link with your audience
  • Connect other data sources to your dashboard. See the tutorials section for inspiration