How would you design a three stage bar chart drill down?

Question

I'm designing a drill-down chart for management to analyze heat trends that are impacting their staff across multiple factories.

The images show the intended flow in which they would be using the charts.

Chart 1 - the staff groups X exposure to high heat (across all factories) after selecting 1 staff group

Chart 2 - the list of factories where the selected staff groups had gotten high heat notifications.

After selecting 1 factory

Chart 3 - the amount of notifications the selected staff group in the selected factory receive across the last 3 months.

Is this flow intuitive to the user? Is there a way I could make users get to the same level of detailed drill down in a simpler way? I'm also trying to get them within a single screen so users wont have to scroll back and forth.

Answer 1

I agree with @Danielillo that the second diagram is unnecessary, and I think that you can benefit from adding another dimension of data to either the first or the last level. This would add a small degree of complexity and I believe it would be worth it to remove the extra navigation step. You can either use a stacked bar chart to reflect the factories in the first histogram

or you can use an area chart to add them to your line chart

That's assuming you have a relatively small number of factories.

If you have many factories but few staff groups, you can try reversing the order and break down the factory bars into segments of staff groups (or an area chart according to staff group).

If you have many of both staff groups and factories (let's say over 6), the data might become too difficult to read and then I'd stay with your current approach.

Answer 2

I think the second diagram is unnecessary because of the type of information it contains, it can easily be linked to the third diagram with a top row with the factories and a bottom field with the trends and notifications, similar to the attached image:

• Each color square at the top is a factory
• You can add them a click function to select/unselect and see each notification progress with the respective color
• The dots are the notifications, visible on hover

Check the real interactive diagram at flourish studio → Magic Charts