What's the best chart layout for displaying profit/cost/revenue/turnover

  • Some background

    I work as an independent consultant, and as such I use multiple 3rd party software to keep track of my billable hours, sent invoices, due taxes, bank mutations, etc. However, as with any 3rd party solution, it never does exactly what I want it to do, nor are these tightly integrated with each other, so I decided to build my own solution on SAP's PaaS solution, SAP HANA Cloud Platform

    The issue

    My application will have a dashboard which should display, among other useful things, a YTD graph (or graphs?) with aggregated monthly costs, earnings, and cumulative profit.

    Initially I came up with the following idea:

    enter image description here

    The 'dual stacked columns' depicts the costs (left) and earnings (right), stacked up by category (invoices, taxes, monthly costs, etc) The blue line shows the cumulative profit after each month.

    Now, the real issue I'm facing is that this graph does not seem very 'obvious':

    • I feel the distinction between costs and earnings could be better visualized
    • If I have more categories (approx. 8-12) the stacks become less usable I think
    • Although there is a direct correlation between the costs, earnings and cumulative profit, the line graph does not enhance that correlation, visually

    What could be a solution?

    It could well be my graph of choice is totally ill-chosen, but I'm not sure what it should be... As I have total freedom of how the final result will look like, anything is possible so please think outside of the box. :)

    Ideally, I want the data—monthly aggregated costs/earnings sliced down by category, as well as the (cumulative) profit—to be shown in a single graph. However, if you have good pointers why it should be in separated graphs, then please, by all means show me why and where I'm wrong.

    Any help towards a feasible, viable and desirable graph is highly appreciated!

    Update
    I have added a more accurate graph. Please note this is a mashup between an Excel graph and MS Paint thingamajiggery, so the handdrawn blue line does not represent the true cumulative profit based on the monthly costs/earnings

    I really like the idea of such service showing the cashflow, but I'm quite puzzled by your data as it doesn't jive for me. So what it seem to say: the invoice (income) data is not growing and stays relatively flat throughout two quarters, but cumulative profit (blue line?) is growing, whereas costs are growing really high. This just doesn't compute. And you are showing yearly expenses each quarter, and quarter expenses each month. I suspect I'm reading it all wrong. :-)

    Hi Zoe, my point exactly ;-) PS: Don't pay attention to the blue line too much, I have hand-drawn it using MS Paint so it certainly does not represent the actual truth. However, except for July (where it should decline steeply instead of increasing) at least the increase/decline should be somewhat accurate for the monthly costs (left column) and earnings (right column). I will update the graph to be more accurate

    Hey Robin! What would also help — if you could list out all the data you want to show, and highlight those things you want users to compare.

    Thanks Zoe, you got a valid point there... Maybe I should just show costs vs. earnings in dual, non-stacked columns, and let the user toggle between stacked/non-stacked state?

    Well, stacked bar charts can be as good as something else. I mean, to choose the right vis, you need to select the data in the focus first. Okay, for example, it's cost vs income: I would do it as two overlaying area charts and show stacked area diagrams for both as a breakdown. For example.

  • Zoe K

    Zoe K Correct answer

    7 years ago

    (repeating my comment with illustration of my point) The choice of the datavis will depend on the data in the focus. For example, the main objective is to compare the cost vs income. I would do it as two overlaying area charts and show stacked area diagrams for both as a breakdown.

    enter image description here

License under CC-BY-SA with attribution


Content dated before 7/24/2021 11:53 AM