I’m using Plotly to render dashboards on a product that we are developing. The charts in the dashboard can resize in terms of height and width.
The code for setting the legends are as follows:
layout.legend = {
x: 0.5,
y: 1.15,
orientation: ‘h’,
xanchor:‘center’,
yanchor:‘top’,
font: {
size: this.legendFontSize,
},
};
The problem that I’m experiencing is with Plotly the legend Y position is a static value. Each chart height and legend font-size requires a unique Y position in order to make the chart look neat and professional. See below example where Y = 1.15. For a height of 400x it looks fine, however, the moment the chart height increases to 800px, there is a massive white space whereby the Y need to be manually adjusted through trial and error.
Other charting libraries like chart.js and apexcharts automatically adjust the legend without this problem. Is there any workaround in Plotly?
