How to create a 

Column Chart

Learn how to quickly create an embeddable column chart with Datawrapper.

What You'll Learn


1.

Getting the data into Datawrapper

Learn how to get your dataset into Datawrapper.

2.

Creating the chart

Learn how to turn your dataset into an interactive column chart.

3.

How to publish it

Learn how to embed the chart in your website.

Importing the data

Create a new chart in Datawrapper and copy & paste your dataset. Datawrapper can work with all kinds of data, from Excel or Google Sheets to CSVs or just a pasted table. For example, this dataset powers the chart above the line of the world's total GDP growth:

[["Region","World average","Advanced economies","Eurozone","Developing countries"],["2006","5.5","3.1","3.2","8.2"],["2007","5.7","2.8","3","8.7"],["2008","3.1","0.2","0.5","5.8"],["2009","0","-3.4","-4.5","3.1"],["2010","5.4","3.1","2","7.4"],["2011","4.2","1.7","1.6","6.2"],["2012","3.4","1.2","-1","5.2"],["2013","3.4","1.4","0","5"],["2014","3.4","1.8","0.9","4.6"],["2015","3.4","2.3","1.4","4.2"],["2016","3.7","2.4","1.6","4.7"]]

Copy the dataset into the upload field in Datawrapper, and click Upload and continue. In step 2, Datawrapper will show your data in a table, so you can check whether your data looks correct. Everything looks good here, so lets move to step 3.

 

Creating your chart

Datawrapper automatically created a bar chart with the data we just pasted in. To turn it into a column chart, simply click on Column Chart in the Chart Type-section to change it and Datawrapper will take care of the rest:

Since this dataset contains multiple columns, you can automatically switch between them with the tabs above the chart!

In the Refine tab, we can customize our chart even more.

For example, you can use a different color for negative values to automatically show the columns in a red shade when the value goes below zero.

In the Annotate tab you can add a title and a description on top of your chart.

The finished chart

This is the finished chart we just created. Notice how the 2009-column turns red when you switch to a different data column:


How to publish your chart

Embedding charts into your website is super easy. If you use Datawrapper for free, you can download the chart as a ZIP file and host it on your own website yourself.

When you upgraded to Datawrapper single, you see a range of publishing options for your chart:

You can download the chart as a static image, but the best way to use a Datawrapper chart is by embedding it directly into your website. To do so, click on Export for embedding. Datawrapper automatically generates an iFrame-embed code that you can copy & paste directly into your CMS.

Copy the embed code into your website and you're done!

Other Interesting Tutorials

How to create a Stacked Column Chart

Learn how to create a stacked column chart in minutes with Datawrapper.

View Guide

All-new line charts

Datawrapper has completely revamped line charts: More responsive, cleaner and with annotations.

View Guide