After the United Kingdom 2017 General Election, on Thursday 8th June 2017, I had many conservations about our First Past The Post system (FPTP), and why we do not have a Proportional Representation (PR).

In the UK FPTP system, we have 650 individual battlegrounds, each representing one seat, the party with the most seats wins. This means that a party could technically score second place in every battle but have zero seats in Parliament.

In this tutorial, we will walk through the creation of spaces doughnut charts in Tableau.

## The Data

The source for our data is the British Broadcasting Corporation, otherwise known as the BBC: http://www.bbc.co.uk/news/election/2017/results

I have prepared and put this data into a text file that you can download: **HERE**

## Calculated Fields

We will create a **Path (bin)** object by:

- Right click on
**Path** - Go to
**Create**,**Bins…** - In Edit [Path] set the
**Size of bins**to 1 - Click Ok

The Path (bin) will allow us to use a table calculation to create additional data points between 1 and 360.

*Note: we are using the Path (bin) to densificate date and give us more points to work with. One thing to make sure of is that you check the Show Missing Values.*

We will now need to create the following Calculated fields:

**Center Text Position**: This will be used to position our text in the centre of the Doughnut.

**Index**: returns the index of the current row within a partition. Index starts are 1 but we want our index to start at 0 so we subtract 1.

**WC_PI**: To be able to multiple our Index (based on the bin object) by PI we will need to create a Table Calculation to represent PI.

**Seat Share**: This calculated field will be used for the text at the centre of the Doughnut chart to represent the Seat Share, as a percentage.

**Vote Share**: This calculated field will be used for the text at the centre of the Doughnut chart to represent the Seat Share, as a percentage.

**WC_Position**: This calculated field will give the distance from the centre of the Doughnut.

**WC_Value**: This will give value. Either Percentage of Seats of Percentage of Votes.

** X: **As we are drawing the polygons we need an X point.

**Y: **As we are drawing the polygons we need an Y point.

*Note: the COS and SIN function requires the values in Radians as opposed to degrees. To convert Degrees to Radians we need to multiply by PI and divide by 180.*

**Color**: This is used to give our bars the colour based on the value of the percentage values.

## Worksheet

Let’s start by adding the following objects to our worksheet.

- Drag
**Party**onto**Columns** - Drag
**Path (bin)**onto**Details**- Make sure the
**Path (Bin)**object has**Show Missing Values**selected - If in doubt drag the object onto
**Rows**and then right click to check.

- Make sure the
- Drag
**Type**onto**Details** - Drag
**Party**onto**Details** - Turn the
**Mark Type**to**Line**- Drag
**Position**on**Path** - Make sure the
**Position**is a**Discrete Dimension**

- Drag
- Drag
**Party**onto**Filters**and choose**Conservatives**- This will make things easier to work with for now.

- Drag
**Y**onto**Columns**- Right click on the object, selection
**Compute Using**and then**Path (Bin)**

- Right click on the object, selection
- Drag
**X**onto**Rows**- Right click on the object, selection
**Compute Using**and then**Path (Bin)**

- Right click on the object, selection

You should now see the following:

Excited yet? I sure am, but let us add some colour add formatting to this.

- Drag
**Color**on the**Color Marks**- Right Click on the object, selection
**Compute Using**and then**Path (Bin)**

- Right Click on the object, selection
- Right click on the background and remove the:
- Gridlines
- Zero Lines
- Hide the X and Y Axis

You should now have the following:

We will now complete the Doughnut and add some text to the centre.

- Drag
**Center Text Position**onto**Rows**- Right click and select
**Dual Axis** - Right click on the axis bar and select
**Synchronize Axis**

- Right click and select
- You should have
**AGG(Center Text Position)**as an option on Marks- Remove all objects
- Change the
**Marks**to**Text** - Drag
**Seat Share**to**Text** - Drag
**Vote Share**to**Text** - Right Click on
**Seat Share**and**Vote Share**and change the Number format to**1 decimal place percentage**. - Click on the Text and edit as you please.

*Note: Make sure you go to the X object in Marks and removes the Measure Names, i this has been added.*

## Finishing

Now play around with the **Party** in the **Filter Pane, **edit **C**olors for the various parties, adjust the value of **Center Text Position**, resize as needed, and you should end up with something like the following:

…and that is a wrap.

I hope you enjoyed this blog and please, please, please, do leave me a comment below and message me on twitter **@thoang1000** is you have any issues.

I am completing a book on fun stuff with Tableau where we will go into more depth understand the various techniques in depth. I hope you check it out and find it useful.

Thanks but quick question, how did you calculate path and position values in data? Is there a formula ?

Please advise and thanks for sharing..

The inner doughnut has the position from 1 to 1.2 and the outer doughnut has a value from 1.3 to 1.5. This was arbitrary. The path value is choosing because we are dealing with a circle.

Thanks, but is there a mathematical formula to calculate ? thanks for replying it is really helpful.

I meant how did you calculate path values…

For densification, I use to two rows and values 1 to 360, this is because I essentially will be drawing a circle. Once there is two records in my dataset then I can create a Bin object and add more values.

Perfect..thanks a lot !! You are genius..