Plotly.js不一致地向图表添加上边距，如何防止它

Question

使用Plotly.js我有时会添加一个上边距（不一致），其中图形的总高度为300px，但图形本身只有150px高。然后拉伸SVG容器并且实际图形更小。我该怎么做才能防止这个空白区域，为什么它只是有选择地出现？

Plotly Matlab语法导致300px div而不是300px图：

`% PLOT MEAN MOVEMENT
    data = {...
      struct(...
        'x', nScan, ...
        'y',fastmotion, ...
         'type', 'scatter')...
         };
    if max(fastmotion) < 0.3
        yminval = 0.3;
    else
        yminval = round(max(fastmotion) + 1);
    end
    layout = struct(...
    'yaxis', struct(...
    'title', 'Movement (mm)', ...
    'range', [0, yminval]));
    header{3} = 'Absolute Movement';
    layout.width = 800;
    layout.height = 300;
    p = plotlyfig; 
    p.data = data;
    p.layout = layout;
    p.PlotOptions.FileName = 'plot_5';
    html_file = plotlyoffline(p);
    html_file;`

Answer 1

您可以在其他问题上查看this answer，这是fiddle。

您可以使用的快速代码：

var layout = {
  margin: {
    l: 20,
    r: 20,
    b: 20,
    t: 20,
    pad: 5
  }, title: false
};

正如mfedoten在他的回答中所说：But be careful if you have tick labels, if you set margins to zero the labels will be cropped

Answer 2

显然，plotlyfig.m中的第68行导致了这个问题：

obj.PlotlyDefaults.MinTitleMargin = 80;

即使我没有标题，它有时会在图表顶部添加80 px，最大值在指定的图形高度。将此值设置为0可以解决问题。

Answer 3

可能在plotlyfig.m中的第68行设置默认边距。

您可以手动设置边距：

Definition

您可以找到有关边距here的文档。

但是如果你有刻度标签要小心，如果你设置边距为零，标签将被裁剪。