

The Beautiful Table - communicating football statistics with D3.js - jonferry
http://the-beautiful-table.com

======
aw3c2
Sorry, this site is only viewable in Chrome or Safari.

~~~
jonferry
Sorry about that. Technically it works on Firefox, however, importing SVG from
URLs and resizing them, which I do for the club crests, wasn't working in
Firefox correctly. So, instead of having a half working project, I decided to
force Webkit browsers.

~~~
mapleoin
_So, instead of having a half working project, I decided to force Webkit
browsers._

You realize that you still have a half working project, right?

------
dhchait
First of all these are soccer stats, not football at all. So I call B.S.

Secondly, in all seriousness... While pretty, they are quite hard to make any
actual use of. Things that should be compared are far from each other and
oriented differently making them difficult to compare. Trends are hard to
notice because everything is so widely spaced. The losing team score is too
faint so it fades from the vision.

But yes, it is pretty.

~~~
nagrom
Funnily enough, in most countries where 'soccer' is popular, it is called by
some local direct translation of the word football: football (UK, France),
futbol (Latin America, Spain), and Fußball (Germany). And this makes sense,
because in 'soccer', the ball is mostly played with the foot. American
Football, on the other hand, has the ball mostly played with the hand and only
the USA refers to the game as 'soccer', which is an anachronism stemming from
the English turn-of-the-century phrase "Association Football" - now long
defunct in its homeland. And that shows how often Americans speak English that
originated in England but is no longer used there, having been supplanted by
continentalisms over the course of decades and centuries - see
<http://topdocumentaryfilms.com/adventure-of-english/>

Of course, you're stuck as to what to call American Football, because handball
is now a completely different sport that is popular in central europe, but
never really cracked the anglosphere.

Completely off-topic, I know, but interesting nonetheless. There's probably
some analogy that can be drawn here between common names for things and the
various display ports that are used and fail to be standardised upon, but I am
too tired to find it :-)

~~~
7rurl
How about American Rugby?

------
logical42
Look, I'm going to be critical in this comment, so let me preface my remarks
by saying something nice: this work seems to demonstrate that you have some
coding chops. Additionally, you seem to have a good sense of aesthetic,
because the data visualization does, in fact, look pretty.

However, I'm a bit put off by it. You mention Tufte, but then you have 16 step
explanation of what the data visualization actually is and what it is intended
to show. Your chart doesn't really convey any meaning to me when I look at it
because it's unclear what the axes actually are, what the opacity is supposed
to represent, and the little number on the side makes no sense unless you
hover over it. You've succeed in making a chart very pretty but I feel that
you may have stumbled a bit in making it comprehensible.

Just my two cents.

------
patrickk
Very cool!

If you could combine it with historical data, you could make a fortune selling
data to pro-gamblers ;-)

<http://www.football-data.co.uk/downloadm.php>

Betegy.com are a site already doing statistical analysis for predictive
purposes across 5 major European leagues.

------
memosanchez
Nice. I think it's a pretty elegant way to display sporting events.

The readability of the data is highly affected by color though. The data for
teams with light colors or teams that lose often are very washed out. The lack
of contrast makes it hard to easily read at a glance.

A switch to show the team on a single side of the x-axis would also be useful
for showing trends.

------
novakinblood
I naively was expecting this to be American Football stats due to my deep
Midwestern roots. Plus was sad Firefox was left out to dry.

------
gawker
Very nice - although I'm not too sure what it's trying to communicate to me.

Btw, did you have to pay for your stats?

~~~
chris_wot
How can it be nice if you've no idea what it is conveying?

~~~
gawker
By nice, I meant that the presentation was nice and clean. And I understood
each individual piece of data but I am unsure if I was supposed to identify a
trend amongst teams or not.

------
tmzt
Adding to the disappointment, but I was hoping to see a really good example of
using D3 for tabular data, updated in real time from JS (such as from Ember)
without re-rendering the entire DIV.

------
doug1001
because i'm a programmer rather than a graphic designer, i don't judge beauty
by the rendered image; in other words, whether this qualifies as beautiful or
not depends in large part on the code that created it--e.g., is the code a
reliable and straightforward re-useable template such that the data as well as
the data source can change without breaking?

you went to a lot of trouble to prepare a detailed explanation of your
creative process; have you made the code available?

------
kadjar
Any chance of getting MLS in there?

------
barista
Does not work on IE :(

