I'm using a Bootstrap sidebar for my website with several Plotly graphs. The Plotly is responsive with window size change, but when I toggle the sidebar button on and off the graphs do not adjust properly. Is there a fix to this? Partial code for Plotly listed.
Plotly chart not responsive -- extra space in the border when sidebar toggled off
var layout = {
xaxis: {
rangeselector: selectorOptions,
rangeslider: {}
},
yaxis: {
fixedrange: true,
side: 'right'
},
margin: {
l: 50,
r: -50,
b: 50,
t: 30,
pad: 4
},
yaxis: {
fixedrange: true,
side: 'left'
},
showlegend: false,
};
var config = {responsive: true};
Assuming you know when the sidebar has been toggled, you can call Plotly.Plots.resize(yourPlotlyDiv)
afterwards.