Layers of Pie

I have played around with “better” pie charts before, but after using a fitness / food tracking app that used pie charts extensively I wanted to see if I could replace them with something more useful in that same footprint. 

I’ve removed labeling to make the images less busy, but generally the different colors would be different categories, with each wedge being a data point. The dashed line represents 100% of the goal, the outer line representing 120% or the highest value in the set. More or less this is 16 bar charts in the space of a pie chart. This model is designed for data sets where the most important information is the relationship of the data point to the goal. 

To build out the whole day, four meals in this case (snacks is the fourth), the single meal chart gets repeated, each repetition’s length from center or the end of the previous section to  it’s end. For other data sets there will be a point where the sections become too small to be useful, but four works well. Prototyping with real data to adjust the clarity of the 100% line would assure that.

With some sample data we can see two different ways this chart allows for analysis. To the left, data is kept within its section and per meal per data point checks are straight forward. Because the outside line of the section’s circle is defined by 120% or the highest percentage in the system there will not be overlaps. 

For an overall evaluation, the given example shows each meal’s data stacked with a single goal line for the day. Opacity is used to have the different meals define what portion of total is coming from which meal in the accumulation over the course of the day. The orange section can be too subtle on some screens, the opacity would be fine tuned moving forward. 

I can see these being toggled between in order to see what meals were lacking even if the daily goal was hit, or what meals did well even if the goal wasn’t hit.