Axis labels in multiple plot grid

It should be simple, but I can’t find how to put different axes labels on a grid of plots.
For a single plot, the axes labels are in the layout. But as there are multiple plots, that does not seem to work. Here is what I tried (but does not work, see uploaded image):

var trace1 = {
x:xarr,
y:yarr,
xaxis: {
title: {
text: ‘x Axis’,
font: {family: ‘Courier New, monospace’,
size: 18,
color: ‘#7f7f7f
}}},
yaxis: {title: ‘Y AXIS TITLE’},
mode: ‘markers’,
type: ‘scatter’,
name: ‘Some title’
};

The layout:
var mylayout = {
grid: {rows: 2, columns: 1, pattern: ‘independent’},
title: {text:“EHMP Water quality time series”},
};
I’m using this plotly script:
src=“https://cdn.plot.ly/plotly-latest.min.js”>

Any help would be welcome!

Hi @pan_054 ,

if you have two traces, you can set second trace with the x coordinates refer to layout.xaxis2 and the y coordinates refer to layout.yaxis2.

And set the titles for xaxis, yaxis , xaxis2 and yaxis2 from inside the layout.

var trace1 = {
  x: [0, 1, 2],
  y: [10, 11, 12],
  xaxis: 'x',
  yaxis: 'y',
  type: 'scatter'
};

var trace2 = {
  x: [2, 3, 4],
  y: [100, 110, 120],
  xaxis: 'x2',
  yaxis: 'y2',
  type: 'scatter'
};


var data = [trace1, trace2];

var layout = {
grid: {
    rows: 2,
    columns: 1,
    pattern: 'independent',
    roworder: 'bottom to top'},
    
yaxis: {title: 'Y Axis Trace 0'},
yaxis2: {title: 'Y Axis Trace 1'},
xaxis: {title: 'X Axis Trace 0'},
xaxis2: {title: 'X Axis Trace 1'},
};
Plotly.newPlot('myDiv', data, layout);

Hope this help.

Kind regards,

Francis Pantus
pan_054@outlook.com

Hi Faris,

Great, that works!!!

Thanks very much for your excellent help.

Cheers

Francis

1 Like