Guest Post
Tony has genererously invited me to post some samples of work I've done building on his elapsed difference time charts.
I used his gnuplot scripts to generate SVG files (XML vector graphics) of the basic graph, and then post-processed these to add some extra details.
In particular
- I highlight the 2 cars immediately ahead and the 2 cars immediately behind the target car on any one lap - this helps identify the battle a car is in, but you can still see the position relative to the rest of the pack (so when a line changes thickness, this means the car has moved within or outside of the target car plus or minus two positions)
- I've added small line markers at each data point as it helps the eye differentiate the true gaps
- I've added an extra line representing the target car one lap later - this line stands out at the bottom of the graph and shows you how the target car's pace varied over the race, including pitstops. It also lets you easily see when backmarkers were caught and passed
- In the SVG version of the chart, if you hover the mouse over a line, you should get (in most browsers) a tooltip telling you the driver name and lap number
- If you view the SVG version in a WebKit based browser (primarily Chrome or Safari) you can roll the mouse to zoom in or out at the point under the mouse
Now unfortunately, blogger (and most other blogging services) don't recognise SVG as a valid filetype for posts yet, so I've put PNG versions of the images below, but they're linked to the SVG versions hosted on dropbox as per Tony's comment below, where he also explain where he has published the scripts I used to generate these from Tony's elapsed times CSV data files.
So here's the chart for Jenson Button - in Button's chart in particular I believe you can see how he eases off in the last stint to preserve his tyres (the laptime levels off around lap 46 despite the reducing fuel load), but despite this his tyres fail in the last few laps (lap 53 onwards) and his laptimes fall quite noticeably
and here's Lewis Hamilton's chart in comparison (note also the slow 3rd pitstop)
Great stuff, Tim - I love the use of the horizontal tick marks (will have to remember that trick:-)
ReplyDeleteI popped a couple of the SVG files into a public dropbox folder:
http://dl.dropbox.com/u/1156404/f1dataJunkie/gp3.svg
http://dl.dropbox.com/u/1156404/f1dataJunkie/gp4.svg
I also (very gratefully:-) uploaded your code to:
https://github.com/psychemedia/f1DataJunkie/tree/master/raceHistory-svg
I wonder why it's so hard to find places to upload and serve SVG from??? Does that suggest an "opportunity", I wonder?
I've edited the post to link the PNG images thru to the dropbox files (but left the PNG placeholders in place for now as an overview).
ReplyDeletere: SVG hosting, I was surprised picasaweb rejected them - I should experiment and see if it's the presence of javascript within the image that it objects to, or SVG in general.
SVG does seem to have been largely neglected over the year, historical lack of adoption in IE (prior to IE9) probably counts for a large part of this. I hope with the push for HTML5 it will be reach equal footing with PNG and other image formats.