Archive

Archive for the ‘Interactive’ Category

Washington Post graph, again

August 22, 2011 Leave a comment

I’ve made another version of the Washington Post graph. (See the original Washington Post graph here. See my remake of it in the tutorial starting here.)

In the new version, I’ve extended the detailed view down to the level of country. So the levels are now total across continents, total for each continent, and total for each country. If you’ve seen the versions in the tutorial, the interaction has changed a little. Now clicking on a shape only takes you to a more detailed view. To go back, there are now buttons under the main title. This version has the smoother transition between levels that was introduced at the end of the tutorial.

See the new version here.

Advertisements
Categories: Graphics, Interactive

Remaking a Washington Post graph, part 5

August 12, 2011 Leave a comment

This is the fourth part of a tutorial for making a graph like this one on the Washington Post website, using RaphaëlJS.

Click here to go to the first part of the tutorial
Read more…

Remaking a Washington Post graph, part 4

August 7, 2011 Leave a comment

This is the fourth part of a tutorial for making a graph like this one on the Washington Post website, using RaphaëlJS.

Click here to go to the first part of the tutorial
Read more…

Remaking a Washington Post graph, part 3

July 30, 2011 Leave a comment

This is the third part of a tutorial for making a graph like this one on the Washington Post website, using RaphaëlJS.

Click here to go to the first part of the tutorial
Read more…

Remaking a Washington Post graph, part 2

July 28, 2011 Leave a comment

This is the second part of a tutorial for making a graph like this one on the Washington Post website, using RaphaëlJS.

Click here to go to the first part of the tutorial
Read more…

Remaking a Washington Post graph, part 1

July 27, 2011 Leave a comment

This is the first part of a tutorial for making a graph like this one on the Washington Post website. My clone of the graph will use RaphaëlJS, and unfortunately my clone doesn’t yet work in Internet Explorer; it should work fine in any other browser.

You can see the cloned graph here.

Who’s this tutorial meant for? It’s aimed at people who already know the basics of JavaScript, who have little or no experience with making visualizations from scratch, and who haven’t used RaphaëlJS. Chances are, this tutorial will sometimes be too basic, and sometimes assume too much. I apologize in advance. If you have any questions, I’d be happy to try to answer them.
Read more…

Firefox extensions tool

January 16, 2011 Leave a comment

I revisited the Firefox data that I used earlier, in order to answer this question: What per cent of users have more than X number of extensions, and what per cent less than X?  Or rather, I wanted to make an easy way for other people to answer this question.  I made a pair of graphs.  Nothing too fancy, just a histogram and scatterplot.  The histogram is for determining what per cent had exactly X extensions, and the scatterplot for what per cent had X or more and X or less.

It looks like this:

The interactive version is here.  Mouse over a bar or dot to find the per cents.  The graphs can be panned left and right by dragging on their backgrounds.

As always, it might not work in Internet Explorer.  And if it’s too big or too small you can use your browser controls to resize the page.

Categories: Graphics, Interactive