CODEWITHSUNDEEP
pythoncssplotlyplotly-dashplotly-python
Cauder
Cauder

Reputation: 2597

How do I make the space between subplots smaller?

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.

Upvotes: 0

Views: 837

Answers (1)

Hamzah Al-Qadasi
Hamzah Al-Qadasi

Reputation: 9786

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)

Upvotes: 1

Related Questions