The Plotly Blog

Multiple Axes Scales with Old Faithful Data

Dual Axes in Plotly

R users find it notoriously difficult to plot two series on the same graph but with different y scales. Plotly has just introduced a feature that makes it really, really easy. Read on to find out how.

The above graph of the classic R Old Faithful dataset is a great example of when you might want two different scales on a single graph. The histogram shows the bimodal nature of the time between eruptions. Awesome. However, one of the coolest features of the Old Faithful data is that the bimodal eruption lag times correlate to a separate bimodal distribution of eruption length. A straight scatterplot doesn’t show this relationship very well, and if we try to graph both a scatterplot and a histogram on the same axes, we get this extremely unhelpful graph (with icky mixed units on the y axis):

Multiple y axes to the rescue! Our histogram scale of Probability is independent of our Eruption Time scale in minutes. If our histogram changes (maybe we add more points, or change from a probability distribution to a frequency distribution), the graph is still clear and compact. Plus, the scatterplot overlaid on the histogram has the added bonus of reinforcing the nature of a histogram — it represents how many points fall within each bin on the x axis (you can read more about the nature of histograms here)

Plotly multi-axis graphs are also fun to interact with. If you mouse-over an axis (so that it’s a double arrow), you can click and drag to move just the trace that axis represents up or down (or left/right if you click on the x axis). If you move the mouse to the top or bottom of the axis (so that it becomes a single arrow), click, and drag, then you can zoom in or out on a single trace. So our first graph is just a few clicks and drags away from this one:

If you’re an R user, you’re probably chomping at the bit to know how to make this graph. We’ve made it pretty easy for you. You can find all the code which created the graph in this gist, but the bulk of it (the first 112 lines) has to do with styling the layout, look, and feel of the graph. You can read more about building and styling your graphs in R in our API documentation.

Here, I’ll highlight the key elements which build your multi-axis graph. We store data and layout information in named lists. Axes are lists within these lists. Here, we create three axis lists: xaxis, yaxis, and yaxis2, placing one of them on the right and one on the left (the default). You can about read many more options for multiple axes, inset axes, or separate subplots in our documentation.

Next, we create two graph objects: the histogram

and the scatterplot.

The key line here is yaxis = ‘y2’. ‘y2’ points this trace to the yaxis2 object (while ‘y3’ would point to a yaxis3 object, if we had created one). If you’re already comfortable with R code in Plotly, you see that you’re really adding just a few new lines of code. If this is your first time checking out Plotly and R, we hope the whole process seems simple and clean to you.

If you’re not comfortable or don’t feel like coding, Plotly also makes it easy to add multiple axes in our GUI. Once you’ve created a graph with multiple traces, you can add a new axes under the Style menu by clicking (plus, we offer API’s to code in Python, Julia, MATLAB, and Perl, if that strikes your fancy).

We’ll leave you with an alternative way to view this Old Faithful data, still built using Plotly’s multi-axis feature.

The R code for this graph can be found here (again, the first 118 lines largely define the style and layout). The histograms for each variable are plotted on sub axes, the width of which is determined by the “domain” element. While this type of graph might be something you’re already comfortable making in R, we hope you see how easy it is to make in Plotly, interact with dynamically, customize, save, and share.