如何防止绘图图例的宽度限制图表数据的可用空间？

Question

我的应用中有一个绘图图表。我在绘图区域上方有一个水平图例。当字符串被本地化为另一种语言时，图例的宽度自然会发生变化，而且绘图本身也会变窄，好像为额外的图例文本腾出空间。

图例在情节上方，因此不应干扰任何情节元素。是否有一些设置可以保护绘图尺寸免受图例的更改？

这是我的布局：

{
    legend: {
      x: .5,
      y: 1.3,
      orientation: "h",
      traceorder: "normal",
      bordercolor: '#FFFFFF',
    },
    margin: {
        l: 80,
        r: 40,
        t: 60,
        b: 40
    },
    shapes: [
        {
            name: "4 hour threshold",
            type: "line",
            xref: "paper",
            yref: "y",
            x0: 0,
            y0: 4,
            x1: 1,
            y1: 4,
            line: {
                color: gray,
                width: 1,
                dash: "dot"
            }
        }
    ],
    title: {
        text: "<b>$therapy_report_usage_hours</b>",
        font: {
            family: "Helvetica"
        },
        x: 0.05,
    },
    xaxis: {
        tick0: 6, // start on the 6th tick
        dtick: 7, // label every 7 ticks
        range: [-1, 30]
    },
    yaxis: {
        showline: true,
        ticklen: 10,
        range: [0, 12],
        dtick: 2
    }
}

Answer 1

解决方案是将图例锚定在右侧。这是布局中更新后的图例元素：

{
    x: 1,
    xanchor: "right",
    y: 1.3,
    orientation: "h",
    traceorder: "normal",
    bordercolor: '#FFFFFF',
}