如何在Plotly中使用px.imshow并排显示两张正方形图片？

问题出在子图的坐标轴没有强制保持1:1的纵横比。单独用px.imshow时，Plotly会自动给图像设置aspect="equal"来保证正方形显示，但把图像trace加到子图后，这个设置不会被继承，子图的轴会默认填充分配到的空间，导致图片变形。

直接给每个子图的坐标轴设置aspect="equal"就能从根源解决问题，不需要靠调整整体图的宽高来近似。修改后的代码如下：

import numpy as np
import plotly.express as px
import plotly.graph_objs as go
from plotly.subplots import make_subplots

im1 = np.random.random(size=(256, 256, 3))
im2 = np.random.random(size=(256, 256, 3))

fig = make_subplots(rows=1, cols=2, shared_yaxes=True, horizontal_spacing=0.01)
fig.add_trace(px.imshow(im1).data[0], row=1, col=1)
fig.add_trace(px.imshow(im2).data[0], row=1, col=2)

# 关键：给所有坐标轴设置等纵横比，同时隐藏刻度标签（可选，优化视觉效果）
fig.update_xaxes(showticklabels=False, aspect="equal")
fig.update_yaxes(showticklabels=False, aspect="equal")

fig.update_layout(width=600, height=300, autosize=False)
fig.show()

原理说明 #

• aspect="equal"会强制坐标轴的单位长度在x和y方向保持一致，确保正方形图片不会被拉伸或压缩。
• 隐藏刻度标签是可选操作，图片展示场景通常不需要坐标轴刻度，去掉后视觉效果更整洁。
• 无论你设置整体图的宽高是多少，只要每个子图的轴保持等纵横比，两张图片都会严格显示为正方形，不用再靠放大整体尺寸来凑近似效果。

内容的提问来源于stack exchange，提问作者Rangumi