Friday 25 January 2013

The easy way to make reports

The problem

Working on my project I have a tendency of generating up lots of data logs.  These things might be players score each time they play it, or how active someone has been while exercising in front of a Kinect.

Either way, its a lot of data & it generally looks like this:

image

I happen to like logging data in comma separated variable format (CSV), as it’s easy to generate, quite easy to read in. And as an added bonus, I can load it into Excel and look at it as a nice graph.

The only real issue: is it’s a bit tedious loading up Excel to have a look at all the data. I’m not sure what my users will think about doing this all the time. But since I didn’t have a better solution & I don’t want to spend weeks building up a GUI front end just to look at some logs, so I left it as is.

An Idea

A couple of days back I was looking at Devmag.org and I found:

And these caught my eye.   The articles are all about writing logs in html to make them easier to visualise. But my logs are all in text format, designed to be easily machine readable/writeable, but not suitable for human reading.

But rather than go back & redesign all my logging code to output html, I decided to write a simple program to read the logfiles & output nice looking html.

The result

Have a look, nice well laid out data.  The appearance is all due to CSS’s, so it’s easy to change the appearance.  The tables are actually filter-able and can be sorted based upon each field thanks to http://www.javascripttoolbox.com/lib/table/

image

And I can have nice effective graphs thanks to http://bluff.jcoglan.com/

image

Conclusion

It was only a day’s worth of C# coding to convert my log files into html.  And that included the time to find suitable JavaScript libraries to do the nice presentation for me.
I can see that this will be used again to make nice looking reports.