1

I'm designing a dashboard that visualises AWS cost details on a bar graph. Below is a weekly view and all seems fine.

enter image description here

However there's also a need to show the data across a boarder timeline, like monthly and weekly. I'm skeptical on simply showing the in the same manner for these longer timelines. i.e. showing the 31(1 month) and 93(3 months) bars across the same width that was showing just 7 bar would look too complicated. Any suggestions or solutions on how to go about this would be appreciated.

2
  • 1
    when you say too complicated, are you referring to the visual clutter generated, and the difficulty of potentially selecting a discreet data point? Is there some additional interaction or drilldown that users do here?
    – Mike M
    Apr 13, 2020 at 16:34
  • @MikeMyes yes i meant the visual clutter
    – Blue Ocean
    Apr 14, 2020 at 1:11

2 Answers 2

2

I think 31 bars per month is not that bad, it depends a lot of how much information your have to show in how much space. The way I see this working is grouping the data a little bit differently:

  • Weekly > 7 Days/bars
  • Monthly > 4 Weeks/bars (or 31 Day/bar)
  • 90 days > 12 Weeks/bars
  • 180 days > 27 Weeks/Bars

Here is the same problem solved by Googles' Analytics interface:

7 Days view

enter image description here

90 Days view

90 Days view

180 Days view

enter image description here

1
  • thanks for the answer. I see google analytics shows each week of data in a single bar in the longer time scales. This means that they average out 7 bars into 1. i'm curious if this is a fair way to visualise data that might vary too much, e.g. a single day spike might be missed or greatly influence the average
    – Blue Ocean
    Apr 14, 2020 at 1:30
2

The goal

It's important to ask yourself, or better said, your users, whats the most important aspect to visualize and communicate with this graphic.

If the graph's main goal is to visualize the peaks and the total per day/week/year, the disposition you propose is okay (bars next to each other). You can enhance it by letting users zoom in and out when it's necessary to get a better look at a particular range.

This is usually achieved by most js graphical libraries in some or other way, some selecting a zone that is delimited below the graph, other by dragging (easy to find in stocks and finance graphs), others just by scrolling with the mouse or doing the expansive gesture with two fingers on the smartphone (link Kendo UI does) enter image description here


But...

If the goal is to make it easier to visualize and compare the stats inside each day/month/week, I think it's much more clear if you display them the other way around (one on top of each other) enter image description here

Benefits:

  • It's much easier to scan and compare the evolution between days/weeks/months.
  • You'll always have enough space to show the specifics numbers/% of each section, which is generally very desirable.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.