Switching X and Y axis in horizontal barplot

đź“Š Plotly Python
1

Hi,
I want to plot a horizontal bar plot and I have the below X and Y array:

x=['giraffes', 'orangutans', 'monkeys']

y=[20, 14, 23]

I cannot rename the x and y columns in the raw data and I cannot change the way the frontend is “reading” the data, i.e. doing something along the lines of

x: seriesData.map((record) => record.x),
y: seriesData.map((record) => record.y),

Is there a way to plot it as an horizontal barplot? In other words, is there another alternative to plot a string formatted x value and numeric y value in a horizontal bar plot thereby switching x and y?

Thanks for any potential help!

2

Hello @OliverK_FHI welcome to the forums.

I’m having a hard time to understand how your graph should look like. Could you add an image or something?

3

Maybe, a question for plotly.js. Does restyle() and relayout() help?

var data = [
  {
    x: ["giraffes", "orangutans", "monkeys"],
    y: [20, 14, 23],
    type: "bar"
  }
];

var layout = {
  title: "Zoo Animals",
  xaxis: {
    title: "Animal"
  },
  yaxis: {
    title: "Count"
  }
};

Plotly.newPlot("myDiv", data, layout);

// reverse using restyle and relayout
var gd = document.getElementById("myDiv");

Plotly.restyle(gd, {
  orientation: "h"
});

Plotly.relayout(gd, {
  "xaxis.title.text": gd.layout.yaxis.title.text,
  "yaxis.title.text": gd.layout.xaxis.title.text,
  "yaxis.title.standoff": 10, // automate calc
  "yaxis.automargin": true
});

// play with extra restyle
Plotly.restyle(gd, {
  text: [gd.data[0].x],
  textposition: ["inside"],
  insidetextanchor: ["end"],
  textfont: [
    {
      color: "white"
    }
  ]
});