Multiple X shared axis in plot.ly subplots

Viewed 1142

I have two subplots with shared x axis and I want to be able to zoom them both - when I zoom one the second adjust automatically but I have problem: x axis can be presented only on first axis or only on second axis. How can I display x axis below both plots?

Cheers, Fih

var trace1 = {
  x: [1, 2, 3],
  y: [2, 3, 4],
  type: 'scatter'
};

var trace3 = {
  x: [2, 3, 4],
  y: [600, 700, 800],
  xaxis: 'x',
  yaxis: 'y3',
  type: 'scatter'
};

var data = [trace1, trace3];

var layout = {
  xaxis: {
    domain: [0, 1],
    anchor: ('y', 'y3'),
  },
  yaxis: {
    domain: [0, 0.45],
  },
  yaxis3: {
    domain: [0.55, 1]},
    anchor: 'x',
  };

Plotly.newPlot('compGraph', data, layout);

1 Answers

You can add "subplots" into layout:

var layout = {
  grid: {
    rows: 2, 
    columns: 1, 
    subplots:[['xy'], ['xy3']], 
    roworder:'bottom to top'},
};
Related