Plotly绘图车型数少于6时xanchor设为center无法显示图片如何解决

问题成因 #

1. 核心问题出在固定的sizex=200000参数：你设置了xref="x"，意味着sizex的单位和x轴的单位完全一致。当车型数量少的时候，x轴的总数值范围（分类轴默认底层数值范围为[-0.5, 车型数-0.5]）远小于200000，图片水平宽度过大直接超出画布可视区域，所以无法显示；车型数量≥6时x轴总范围刚好能容纳这个宽度，所以显示正常。
2. 改xanchor为left后图片能显示，是因为图片左边缘对齐x坐标点，不会向左超界，但原本200000的宽度远大于单个分类的宽度，自然会出现偏移。

解决方法 #

把固定sizex改成适配x轴单位的数值即可，以下两种方案按需选择：

方案1：适配分类轴的固定宽度（实现最简单）

分类轴相邻两个车型的间距为1个x单位，把sizex设为0.6~0.9之间的数值，刚好占单个分类的大部分宽度，不会超界：

fig.add_layout_image(
    dict(
        x=xname,
        xanchor = "center",
        sizex=0.8, # 替换原来的200000
        y=min(model_and_price_dct[variant_name]),
        sizey=ysize,
        xref="x",
        yref="y",
        opacity=1.0,
        layer="above",
        sizing="contain",
        source=Image.open(f'image_path/{name_of_image_in_folder}.png')
    )
)

方案2：动态计算sizex（兼容不同数量车型）

如果需要兼容数值型x轴或者不同车型数量的场景，可以根据x轴的总范围动态计算单个分类对应的宽度：

# 加在创建布局、添加完 trace 之后
x_range = fig.full_figure_for_development(warn=False).layout.xaxis.range
x_total_width = x_range[1] - x_range[0]
single_x_width = x_total_width / len(images_label_list)
sizex = single_x_width * 0.8 # 留20%的空隙避免相邻图片重叠

# 后续add_layout_image时用这个动态计算的sizex即可

修改后不管车型数量多少，图片都会在对应数据点的正上方居中显示，不会超界也不会偏移。

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