How do I make the space between subplots smaller?

Question:

I have this subplot-

fig = make_subplots(rows = 4, cols = 1)
fig.append_trace(go.Scatter(
    x=[3, 4, 5],
    y=[1000, 1100, 1200],
), row=1, col=1)
fig.append_trace(go.Scatter(
    x=[2, 3, 4],
    y=[100, 110, 120],
), row=2, col=1)
fig.append_trace(go.Scatter(
    x=[0, 1, 2],
    y=[10, 11, 12]
), row=3, col=1)
fig['layout'].update(margin=dict(l=0,r=0,b=0,t=0))

I also have this css file:

#bar-graph {
  height: 3200px !important
}

And, lastly, I have this app layout command

app.layout = html.Div(children = [
    html.Div([
        dcc.Graph(
            id='bar-graph',
            figure = fig,
            responsive = True
        )])
])

There are huge gaps in between my bar charts in the subplot, even though I set the margins to 0. When I change the height in my css file to something smaller, like 1000px, then the space between the subplots looks reasonable. When the height is 3200, then the space between the subplots becomes huge.

I want to make the space between the subplots very small and keep the height at 3200.

Asked By: Cauder

||

Answers:

When you increase the height to 3200 in the css is totally equivalent to fig['layout'].update(margin=dict(l=0,r=0,b=0,t=0), height=3200). Therefore, it is a Plotly problem rather than a Dash problem. You can solve it by adjusting the vertical space as follows:

fig = make_subplots(rows = 4, cols = 1, vertical_spacing= 0.03)
Answered By: Hamzah