I posted a week ago about how there are some blogs/sites out there that roll their own web statistics and display them SVG. After reading this challenge on the weekend, I decided to work on my own, roughly mimicking these designs.
Without further ado, my live web statistics SVG image is located HERE. It is constructed using a variety of techniques:
- Include a small PHP file to record each document request on my site and blog. Each result is written into a XML file.
- I have another server-side PHP script to crunch each day’s worth of hits into summarized daily statistics XML file.
- I have yet another server-side PHP script that reads in all daily statistics XML files and crunches them into the SVG you see.
Go ahead and play with it. It seems to work for me in Firefox 1.5 and Internet Explorer with Adobe SVG Viewer. It also displays in Opera 9 TP1 but the dynamic/interactivity part does not work in that browser (hoping to see it fixed in the next TP). Can someone with a nightly build of Safari tell me whether anything shows up?
Nonetheless, I’m quite happy with the result because now that it’s written it requires very little manual action on my part to keep it up-to-date. I could hook up calls to my server-side generation scripts to a cron-job if I had a server-machine under my control (mine currently has a fried motherboard), but I actually prefer to ensure that the XML is being properly generated, so for now I’ll just invoke the server-side crunching scripts every few days to keep the SVG fresh.
NOTE: One challenge was to properly embed the SVG image into this blog entry with fallback content. For IE+ASV, I can serve an <embed> tag via a <script> with the fallback being written by a <noscript>. For all other browsers, I can serve an <object> tag to Firefox and Opera the way it should be. However, it seems that WordPress mangles things to a degree such that it will not load inside WordPress. I eventually gave up on this, though I have successfully used this technique in my own HTML pages.