Understanding public spending - 700 tables of data in one diagram

Governments around the world collect taxes and redistribute 30%-50% of our income. Surprisingly, in the age of the internet there is no easy way to track how public money is spent. If you search, you will find impenetrable financial jargon, perplexing government websites, or no data at all. For these very reasons, wikibudgets will present all public budgets of the world in a structured, accessible, and searchable way.

We'd like to present a small example of that wikibudgets can do based on the 2014-2015 budget of the Royal Borough of Greenwich, London. This diagram is derived from data sourced from 720 tables scattered across 14 PDF documents that results in a 5600 node Sankey diagram.

Royal Borough of Greenwich
Royal Borough of Greenwich, Budget 2014 - 2015

What you see is a visualisation tool that combines a Sankey diagram with zoomable interface to tackle the complexity of real-world budgeting. The prototype app is an early Beta which we're continuing to improve. It is not yet optimised for large data sets and its mobile functionality is rather limited. Furthermore, it will only work in select modern browsers (Chrome, Firefox, Safari). We hope you will forgive the current limitations and help us improve with your feedback.

If you like the diagram, start using it yourself with our free Sankey Builder app


Release Notes for v1.1.1

We will now be publishing our release notes for all to see. Please get in touch with us at wikibudgets.uservoice.com with any questions or features you're looking for. Feel free to post in the comments below if you prefer.

New: Browser BACK and FORWARD buttons work like UNDO and REDO for both logged-in and logged-out user.
New: Changed the shape of transfers back to the previous, more flat look. The b├ęzier curve is not nicely rounded when flowing backwards but keeps uniform length elsewhere.
New: In a short transfer, only one SUM label is displayed in the middle of the transfer. In longer transfers, two SUM labels are displayed as before at each end.
New: User is prompted before closing unsaved browser window.
Bug: Many small bug fixes.
Bug: Many small visual improvements.
Enhancement: Diagram performance is improved by not rendering elements that are too small or too large. (the improvement is not as good as I hoped for, I will have to try other things)
Notes: There are still numerous bugs I know of but please let me know every time you see anything wrong


Sankey Builder launch

We are happy to present to you our Sankey Builder - a free web application for building Sankey diagrams made by wikiBudgets.

Sankey Builder is especially designed for diagrams with very large size differences between flows - it zooms in and out like a map to reveal details or to show the big picture. This makes it ideal for visualising financial flows and budgets, you can track how billion dollar budgets transfer into individual assignments down to every dollar - the only limit is the quality of your data.

Here is an example: we used Sankey Builder to model the annual financial report of our favourite charity ActionAid (source: 2013 Annual Financial report and Accounts).

click to open in Sankey Builder

This is a very early release and Sankey Builder is not optimised for mobile yet. Among other things you will not be able to create or edit diagrams - only view them - because the desktop UI is not suitable for touch devices yet.

We welcome any an all feedback you have. Just click on the question mark in the lower left and let us know what you think. We have lots of improvements in development already, multi-node selection, a mobile UI editor and a data import/export feature for example. See what others are asking for over on our customer feedback page.


Introduction to Kinvey-Flash integration

Kinvey is new next-level Backend as a Service (BaaS) platform of choice for the wikiBudgets project. Kinvey aims to support "any platform" and even though they do not list Flash/AS3 explicitly in their documentation when I contacted them about this option they were excited (same as me) and promised their full support. And they delivered it.

Kinvey offers pretty comprehensive REST API - a good start point for every AS3 app. The problem however lies on the side of Flash Player. For various (security?) reasons Flash limits the use of request submission methods as well as request headers. The problems can be divided into three categories:
  • Flash does not support request methods other than GET or POST. Forget PUT, POST, DELETE or others. (There are various workarounds but they always depend on the server)
  • On top of this there is a strange limitation on the POST request. It must contain non-empty payload (body) else it falls back to the GET method. 
  • The third limitation is on the side of HTTP headers (aka URLRequestHeader). The AS3 documentation humbly reveals that custom headers are only supported for POST request method, not GET.
Kinvey team came up with an elegant turnkey solution: In your Flash app always use the POST method for the request and submit the desired request method (as specified by the documentation) in the request payload object in a "_httpmethod" variable.

Please enjoy this complete example of the Handshake request: