How can I adjust space between heading, legend and plot area in Plotly? In particularly I need to increase the space between them without one another collide. I’ve attached the current output screenshot and my code snippet as following.
[Current Output of the chart
<Plot
data={dataArray}
layout={{
barmode: "stack",
autosize: true,
title: preHeading + mainTitle,
margin: {
t: 135,
autoexpand: true,
},
xaxis: {
// all "layout.xaxis" attributes: #layout-xaxis
title: xTitle, // more about "layout.xaxis.title": #layout-xaxis-title
// dtick: 1,
},
yaxis: {
// all "layout.xaxis" attributes: #layout-xaxis
title: yTitle, // more about "layout.xaxis.title": #layout-xaxis-title
},
font: {
// family: "Courier New, monospace",
size: 12,
color: "#7f7f7f",
},
legend: {
bgcolor: "yellow",
x: 0,
y: 1.2,
xanchor: "auto",
traceorder: "normal",
orientation: "h",
},
marker: { size: 40 },
}}
useResizeHandler
style={{ width: "100%", height: "100%" }}
/>
]1