在plotly.js图表​​中被切断的长刻度标签

Question

是否有可能为plotly.js中的刻度标签提供更多空间？我的图表中的长标签正在被切断.

HTML:

<div id="plot"></div>

JavaScript的:

var data = [{
  type: 'bar',
  x: [20, 14, 23],
  y: ['giraffes', 'orangutans', 'a looooooooong string'],
  orientation: 'h'
}];

var layout = {
  title: 'Bar Chart'
};

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

我无法在API中查看如何在y轴刻度设置中执行此操作.

鉴于我的图表的性质,我需要使用水平方向.所以我不能使用的解决方案是垂直方向,蜱旋转90度.

Answer 1

更新:通过以下方式添加对automargins的支持(请参阅https://github.com/plotly/plotly.js/pull/2243).axis .automargin配置选项.

要使用,你会改变:

var layout = {
  title: 'Bar Chart'
};

至:

var layout = {
  title: 'Bar Chart',
  yaxis: {
    automargin: true
  }
};

有关更多信息,请参阅https://plot.ly/javascript/axes/

原始答案:您可以调整绘图图表的边距,为自己增加一些空间.例如,改变:

var layout = {
  title: 'Bar Chart'
};

至

var layout = {
  title: 'Bar Chart',
  margin:{
    l:200
  }
};

你可以在这里阅读更多关于调整边距的信息:https://plot.ly/javascript/setting-graph-size/ 和这里的整体布局选项:https://plot.ly/javascript/#layout-options