Plotly与Dash双X轴标签均垂直显示的实现问题

当你使用Plotly创建带有多层X轴（x=[上层标签, 下层标签]）的堆叠柱状图时，仅设置主X轴（xaxis）的tickangle只会影响顶层标签，下层标签的角度需要通过配置第二个X轴（xaxis2）来单独设置。

修改后的完整代码 #

import pandas as pd
import plotly.graph_objects as go
from plotly.subplots import make_subplots

df = pd.DataFrame({
    "tick": ['VEEERY LOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOONG TEEEEXT', 'VEEERY LOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOONG TEEEEXT', '1', '1', '1', '2', '2', '2'],
    "value": [12, -6, 9, -14, -10, 9, -10, 5],
    "category": ['Born', 'Died', 'Born', 'Died', 'Died', 'Born', 'Died', 'Born'],
    "type": ["Penguin", "Lion", "Penguin", "Lion", "Apes", "Penguin", "Lion", "Apes"]
})

fig = make_subplots(specs=[[{"secondary_y": True}]])
for t in df.type.unique():
    plot_df = df[df.type == t]
    fig.add_trace(go.Bar(
        x=[plot_df.tick, plot_df.category],
        y=abs(plot_df.value),
        name=t,
    ))

fig.update_layout(
    barmode='stack',
    xaxis={
        'title_text': "Tick",
        'tickangle': -90,  # 配置顶层tick标签垂直显示
    },
    xaxis2={
        'tickangle': -90,  # 配置下层category标签垂直显示
    },
    yaxis={
        'title_text': "Value",
    },
)
fig.show()

关键说明 #

• Plotly在你传递x=[上层数组, 下层数组]时，会自动创建第二个X轴（xaxis2）来承载下层标签，因此需要单独对这个轴设置tickangle。
• 原代码中dtick和tickformat是针对时间序列轴的配置，示例数据为文本类型，移除这些配置可避免不必要的冲突。

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