How should you organize 3 charts when two of them are the same type? (i.e. 2 bar graph, 1 line graph)

Question

so I am designing a dashboard and on this dashboard there are going to be 3 graphs, 2 of them are bar graphs and one of them is a line graph. The bar graphs have similar x axis, but different y axis. For example, both bar graphs would have the names of people, but the y axis would be favorite color and favorite movie respectively. This means that both bar graphs would have the same colors representing each individual, as the I do not want to confuse the user with two different legends. On the other hand, the line graph is completely independent and has nothing to do with the other two graphs. I see two options for organizing them in my dashboard:

1. Bar-Bar-Line
2. Bar-Line-Bar

I am thinking of going with option 2 because I don't want the users to confuse the two bar graphs, as visually they would look identical. All the colors would be the same, the only difference being the y axis text. On the other hand, placing similar graphs next to each other makes more sense if the identical visual wasn't an issue. Do you guys see any issues with placing them in a bar-line-bar horizontally across a dashboard?

Answer 1

Think about the data story you want to tell here, and try to group and consolidate elements to support that story.

In your diagram, you have a chance to consolidate the 2 bar graphs, and set up a way for users to see how the metrics might relate to each other.

Rather than be concerned about the identical appearance of the graphs, embrace the chance to group and consolidate, and try experimenting with single Y axis (the names) to allow the user to view without having to repeat the labels.

Horizontal bars are also easier for users to make comparisons within a set, because human vision can more effectively compare length than height.

The temperature has both a different axis, and perhaps less of a correlation to an individual runner. So you can keep as a different group.

Answer 2

If you start from a visual point of view, it does not matter as long as you have a unified visual language.

However, there are other important considerations that may influence your decision:

1. Is this the right diagram?

More important than where to place the charts is whether it is the right chart (or group of charts) for the purpose. Information visualization or data visualization is a discipline of its own, and sometimes it's a good idea to review some general tips, dos and don'ts on the subject. I am not sure if your example shows the information you'll be using, or if it's just a mockup with random data. But based on that, I can not see how the temperature chart will fit with the other information.

2. Am I using a consistent language?

Maybe it's because it's just a mockup, but it's a useful example: instead of using large blocks for bars and thin lines for line charts, it looks nicer and more appealing if you use a consistent design language, including fonts, color palette, and shapes.

3. Use logical groupings.

The most important consideration when placing charts or any other type of Dataviz element is to group them logically. In an example like yours, we might group charts by groups of people, while the temperature chart clearly belongs somewhere else. A tip for this is to identify the subject (who or what is it for?) to group them accordingly by logical groups