Obesity and Education

A D3 tribute to prof. Alberto Cairo

I’m a huge fan of prof. Cairo’s work. In this visualisation I try to recreate the cover of his first book, The Functional Art, using D3.js.

Cairo explains in his book the process of making the chart on the cover. Based on data regarding average obesity and education level in US states, Cairo proposes and analyses several different visualisation methods to show what is the relationship between these two variables, including a scatterplot and finishing in his famous slopechart. In my recreation, I want to compare how these two kinds of chart (scatterplot and slopechart) show the same data. Click the buttons to change the chart.

I based the interactive selections on the slopechart in this Tableau visualisation, which also shows the scatterplot and some other graphics proposed by Cairo. Source of the data here.