Out with the bar charts, in with the donuts - check out the new #D3Thursday article

[AnnaBrown]

The week's #D3Thursday article moves beyond the basic bar chart onto teaching you about the slightly more advanced donut chart. The post covers:

• Creating arc segments with SVG paths
• Designing a mobile-friendly legend
• Creating advanced transitions 
  
  

Check it out and use the #D3Thursday hashtag to chat about it on Twitter.

Build a donut chart with D3.js

[Reeza]

Theoretical question, is a donut chart better than a pie chart?

To me it’s a bar chart with curves, and people can better interpret it compared to a pie chart. The size of a pie slice is not something human eyes are familiar with, compare to straight lines and squares. So IMO I think the donut chart is a great way to show distributions but curious as to what others think. 

[AnnaBrown]

Fantastic question, @Reeza! Including a few people here for thoughts: @RyanWest,  @rajivramarajan and @mamale

[rajivramarajan]

I agree with @Reeza that bar charts are more effective than pie charts in the vast majority of cases. We, in the design team have come to acknowledge that it is compelling to people because it provides a different shape, feels more compactness, and provides more opportunities for color. The Donut variation of the Pie is also driven by an intent to modernize visuals rather then improved data visualization. While comparing adjacent arc lengths may be easy, it takes away the possibility of comparing angles, which we agree isnt the easiest on human eyes. So, yes to bar chart! 🙂

[RyanWest]

Hi Reeza,

Interesting question! 

You are absolutely right! It's thought that donut charts are easier to interpret because the user will be comparing arc-lengths (similar to how we compare straight-line lengths in bar charts) with a donut chart while they will be comparing areas with a pie chart.

Additonally, a donut chart has the advantage that it uses fewer pixels to depict the same data. You can use the empty space in the center of a donut chart to include additional information (as is done in Visual Analytics).

[PaigeMiller]

---

@RyanWest wrote:

You are absolutely right! It's thought that donut charts are easier to interpret because the user will be comparing arc-lengths (similar to how we compare straight-line lengths in bar charts) with a donut chart while they will be comparing areas with a pie chart.

---

While this may indeed be true, I don't accept that "it's thought that...", I'd like to see an actual study that shows it is true.

[RyanWest]

Paige,

I can't seem to find the relevant study but here is something similar: 

"The results show that all three visual cues are important, but that arc length in particular seems to provide important information. Angle is clearly not a significant bearer of information in pie charts, and in particular the central meeting point of the circle segments does not appear to be crucial. Donut charts thus appear to be no worse than pie charts." (https://research.tableau.com/sites/default/files/Skau-EuroVis-2016.pdf)

The idea I was getting at is that by removing the central meeting point the users attention is brought from the center of the pie to the edge, leading them to compare arc lengths instead of angles or areas which are more difficult to estimate.

Hope that helps!

[PaigeMiller]

Well, yes, that helps. But the title still is comparing bar charts to donut charts, not pie charts to donut charts. So in that situation, I vote for bar charts.

And as a side note, I believe that actual donuts are superior to donut charts 365 days a year.

[AnnaBrown]

Great discussion here. To clarify, the subject line of this particular post was simply meant to convey that the latest #D3Thursday article focuses on donut charts rather than bar charts, as the previous two articles in the series discussed bar charts. It wasn't a statement of replacing bar charts with donut charts in general.

[PaigeMiller]

May I suggest that you change the title?

[AnnaBrown]

In light of Dunkin' dropping donuts, I here declare I'm on Team Donut for life. And as such I will keep the title as a sign of my support of the sweet breakfast (scratch that, anytime!) treat.

[PaigeMiller]

---

@Reeza wrote:

Theoretical question, is a donut chart better than a pie chart?

To me it’s a bar chart with curves, and people can better interpret it compared to a pie chart. The size of a pie slice is not something human eyes are familiar with, compare to straight lines and squares. So IMO I think the donut chart is a great way to show distributions but curious as to what others think. 

---

Well, I don't know if this is true or not, but I'm willing to believe that donut charts are better than pie charts.

The original statement (in the title) was bar charts should be replaced by donut charts, and there I am extremely skeptical. The heights of different bars are easily compared visually, but I doubt that similar information displayed in a donut chart provides easy comparisons. Bar charts can be enhanced by grid lines to further enable comparisons of different bars, I'm not aware of a similar way to enhance donut  charts.

[ballardw]

---

@PaigeMiller wrote:

---

@Reeza wrote:

Theoretical question, is a donut chart better than a pie chart?

To me it’s a bar chart with curves, and people can better interpret it compared to a pie chart. The size of a pie slice is not something human eyes are familiar with, compare to straight lines and squares. So IMO I think the donut chart is a great way to show distributions but curious as to what others think. 

---

Well, I don't know if this is true or not, but I'm willing to believe that donut charts are better than pie charts.

The original statement (in the title) was bar charts should be replaced by donut charts, and there I am extremely skeptical. The heights of different bars are easily compared visually, but I doubt that similar information displayed in a donut chart provides easy comparisons. Bar charts can be enhanced by grid lines to further enable comparisons of different bars, I'm not aware of a similar way to enhance donut  charts.

---

Donut charts, at least to me, have the same problem(s) as pie-charts when there are 2 or more "rings" of data and categories of similar measure are not adjacent. For instance in this slightly modified from the GCHART donut example, how easy is it to tell which of Boston or Seattle have larger sales within department or within Boston which department has greater sales? I find the only comparison between the category that defines a ring are the two that share the base line.