Equal width and height produce incorrect actual layout aspect ratio on the screen

📊 Plotly Python
1

I am updating a figure layout as follows:

fig.update_layout(
    sliders=sliders,
    xaxis=go.layout.XAxis(range=[-10, 20]),
    yaxis=go.layout.YAxis(range=[-15, 15]),
    width=800,
    height=800,
    hovermode="closest"
)

Note the width and height are both 800. However, the plotted figure does not have equal width and height in centimetres. on my screen, the width is a little over 13 cm, and the height is a little over 12 cm. The shapes below should be discretization of two spheres, rather than ellipses. Does anyone know if I made a mistake, and how I can fix that?

Many thanks,
Nicholas

image
image805×722 32.1 KB

2

In a figure you have got several dimensions:

  • The dimensions of the figure itself (the whole layout with margins, axis, etc) which you set with width and height
  • The dimensions of the plot area which are defined with width, height, and margin.

If the objective is to have the proper aspect ratio on the figure, the solution is the following:

fig.update_layout(
    # ...
    yaxis_scaleanchor="x",
)

If the objective is to have a plot area that has equal height and width you need to set the margin properly so that it is equal on all sides (note that using plotly.express, xaxis and yaxis have automargin which will limit how small they can get for bottom and left margins)

fig.update_layout(
    # ...
    margin=dict(b=50, t=50, l=50, r=50)
)
3

Thank you! What’s important are the two shapes being proportional in terms of their heights and widths. The yaxis_scaleanchor parameter solves it.