Data visualization expert Edward Tufte’s Five Laws of Data-Ink:
2. Maximize the data-ink ratio
3. Erase non-data-ink.
4. Erase redundant data-ink.
5. Revise and edit.
Plotly has drawn much inspiration from Tufte’s techniques. We apply them in this post.
______________________
Motivated by Lukasz Piwek’s “Tufte in R,” we decided to do a little Tufte-transcribing. The graphs below are meant to add some interactivity to Piwek’s original post which “replicates excellent visualization practices developed by Edward Tufte.”
These interactive graphs were made using Plotly’s web app. To securely share graphs and data within a team and make interactive dashboards, sign up for a Plotly Professional plan or contact us about Plotly On-Premise.
1. Minimal Line Plot
The goal of this type of graph, according to Tufte, is to keep the non-data ink to a minimum – “the data-ink ratio should be equal to 1 minus the proportion of graphic that can be erased without loss of data-information.”
2. Range-Frame Plot
Instead of conventional axes, Tufte uses so-called “range frames.” Range frame plots have axis lines drawn only over the range of the data points.
3. Dot-Dash Plot
Dot-dash plots are scatter plots with tick marks representing the marginal distribution of the data.
4. Minimal Boxplot
This boxplot uses as little non-data ink as possible – existing ink is used to represent as much new information as possible. This is easy to accomplish in Plotly, where, instead of using graph-clogging annotations, a simple hover reveals the minimum, lower quartile, median, upper quartile, and maximum values.
5. Minimal Barchart
This Tufte-inspired barchart illustrates the theme that much can be erased without compromising the data – including grid and axes lines.
6. Sparklines
According to Tufte:
“A sparkline is a small, intense, simple, word-sized graphic with typographic resolution. Sparklines mean that graphics are no longer cartoonish special occasions with captions and boxes, but rather sparkline graphics can be everywhere a word or number can be: embedded in a sentence, table, headline, map, spreadsheet, graphic.”
Plotly’s modern take on the sparkline promotes utility through interactivity.
7. March on Moscow
Charles Minard’s 1869 graph of Napoleon’s 1812 march on Moscow shows the dwindling size of the army. Tufte says that it is probably the best statistical graphic ever drawn.
The broad line on top represents the army’s size on the march from Poland to Moscow. The thin dark line below represents the army’s size on the retreat. The width of the lines represents the army size, which started over 400,000 strong and dwindled to 10,000. The bottom lines are temperature and time scales, and the overall plot shows distance travelled.
Below is our modern version. Moscow is represented by the switch in the middle. The blue line shows temperature along the y-axis on the right. The bottom x-axes show dates and distance. We can also use a custom date format. Hover your mouse reveal data. This interactivity is brought to you by D3.js, the graphing library Plotly uses. Click and drag to zoom.
If you liked this post, please consider sharing. If you’d like to learn how to make these graphs, visit our website or check out our tutorials. We have tutorials that show you how to make and embed graphs in your website, blog, or apps. To learn more about how companies are using Plotly Enterprise across different industries, see our customer stories.