This is going to be a semi-regular feature where I take some graphs I found and re-make them in my web app for charting data, Playfair. Find out more about Playfair at the github page. I’ve made a simple tutorial that walks you through a couple Playfair graphs. And you can try Playfair online here (Chrome only right now).
Two-dimensional scatter plot
Someone in my Twitter timeline posted this (15-month old) piece from the Pew Research Center. I liked the idea of remaking the first graph because it’s a bit unorthodox – basically a one-dimensional scatter plot with quite a few annotations. Here’s the Playfair version:
This really wasn’t that hard to do in Playfair. Here’s the dataset:
country disagree height Venezuela 62 0 United States 57 0 Egypt 56 0 United Kingdom 55 0 Brazil 53 0 Nicaragua 52 0 Israel 51 0 Colombia 51 1 France 50 0 Philippines 49 0 Mexico 49 1 Spain 47 0 Japan 44 0 Uganda 43 0 Russia 41 0 Jordan 41 1 Chile 40 0 Peru 40 1 Thailand 39 0 Palest. ter. 38 0 Indonesia 38 1 El Salvador 38 2 Tanzania 38 3 Greece 37 0 Lebanon 36 0 Tunisia 36 1 Argentina 36 2 Poland 34 0 Ukraine 34 1 China 33 0 Senegal 33 1 Italy 32 0 Nigeria 32 1 Germany 31 0 Malaysia 31 1 Kenya 30 0 India 27 0 South Africa 27 1 Vietnam 24 0 Bangladesh 23 0 South Korea 23 1 Ghana 23 2 Turkey 20 0 Pakistan 13 0
The ‘height’ column is the y-variable for Playfair’s points charting element. So making this chart is as simple as plotting disagree against height and then… doing a ton of work in the settings tab. I made the graph 255 pixels high, changed the settings for y-axis ticks so they are hidden (for stupid reasons, the right way to do this is to change the y-tick text size to 0.5, NOT 0), and messed with the graph margins a lot to make the spacing look right. The median line is a trendline drawn from -4 to 6 (which are also specified as the limits of the graph in the design tab, since Playfair would normally just have the y-axis go from 0 to 3 for this data). The last step was to recolor the US data point and add annotations for several countries.
Scatter plot with trend and text labels
I also remade the third chart in that post. It’s just a scatter plot with text labels and a trendline (Playfair can only do linear trends right now so I had to ditch the logarithmic trend). Here’s the chart:
This one required very little custom work. Here’s the dataset:
country religion region gdbpc Canada 24 North America 44655.717 Italy 30 Europe 30803.002 Greece 35 Europe 24574.13 Poland 24 Europe 22201.121 Czech Republic 10 Europe 28086.483 Russia 18 Russia 18407.849 Turkey 70 Middle East 15767.332 Egypt 82 Middle East 6695.757 Jordan 82 Middle East 6281.488 Lebanon 57 Middle East 15077.617 Tunisia 79 Middle East 10252.567 Israel 25 Middle East 35658.681 Australia 21 Asia/Pacific 44345.873 China 2 Asia/Pacific 10694.698 Indonesia 94 Asia/Pacific 5498.999 Malaysia 77 Asia/Pacific 18639.154 Pakistan 98 Asia/Pacific 3231.228 Philippines 86 Asia/Pacific 4961.667 Korea 19 Asia/Pacific 34795.424 Argentina 32 Latin America 18917.284 Bolivia 68 Latin America 5616.468 Brazil 74 Latin America 12525.674 Chile 39 Latin America 19887.291 El Salvador 80 Latin America 7719.914 Mexico 45 Latin America 16111.463 Venezuela 42 Latin America 13530.524 Ghana 89 Africa 3589.691 Kenya 87 Africa 1903.429 Nigeria 90 Africa 2997.391 Senegal 97 Africa 2019.689 South Africa 69 Africa 11542.945 Uganda 86 Africa 1551.199
In the points tab, I set the x-variable to gdbpc, the y-variable to religion, and the color variable (which groups the by point color) to region. I fiddled with point parameters in the settings tab to get something a little bigger than the default solid point. There are a few ways you could add the text but the easiest is to use the text geom (tab) by setting the same x and y variables and then indicating the country variable as the actual text. I manually moved the text around so none of it was colliding. Finally, I fit a linear trend to the data in Excel and included that line using the segments/trend lines tab.
Simple bar graph
There is a barchart circulating on Twitter from IMDB.com that shows the male/female breakdown of reviews for the new Ghostbusters movie. I’m throwing this in here because I haven’t shown any Playfair bar charts yet. There’s nothing fancy about this – the data is once again grouped by the color variable but otherwise this is a 30-second job in Playfair so I’m not going to explain it too much here.
