guardian/frontend — pull request #3782 by jamesgorrie (2014-04-03 12:30:11+00:00)
Title: Added doughnuts component and doughnuts table abstraction

We needed a doughnut on the Football stats.
I will list avenues, some proved dark alleys in the end:

* Use a good SVG / data-vis lib (d3, snap etc). The size to benefit ratio never quite worked out. i.e.
```JavaScript
d3 = { benefit: 'large', filesize: 'HUGE!' };
snap = { benefit: small, filesize: 'Medium' };
```
* Use chart JS. This didn't work out as it is not remotely feature rich enough (adding label). We could however fork it. The next stumbling block was it uses canvas - which made styling within our SASS architecture neigh impossible.

* Bake our own :beers:

SVG in and of itself is not that complex. We are not adding huge amounts interactivity, and if we were, it would probably be an interactive, which we already have our ways of including d3 and making things supersnazzy.

On NextGen itself, I cannot see us using more more than 2-3 charts, and if this expands, we should look at what we are considering non-interactive.

There is a bit of optimisation on the actual doughnut that could be had - but I think the API is sorted, making refactoring simple.

# Shuddap and show me
![dogbuts-small](https://cloud.githubusercontent.com/assets/31692/2603200/97ad3b4a-bb2b-11e3-9680-358ddc2d3a2d.png)

---

![Dog nuts](http://scumbaganimals.com/wp-content/uploads/2013/06/funny-cone-dog-eating-food-bowl-scumbag-animals-animated-gif-pics.gif)