Plotly子图Range Slider配置：如何将滑块置于第2行而非生成重复行

编写了如下代码生成带有单个Range Slider的子图，但希望该Range Slider位于第2行下方，而非出现重复的第2行布局，求实现方法。

用户提供的原始代码 #

import pandas as pd
import plotly.express as px
import plotly.subplots as sp
from datetime import datetime


data1 = [
    [1, datetime(2022, 11, 26)],
    [7, datetime(2022, 11, 29)],
    [4, datetime(2022, 11, 30)],
]
df1 = pd.DataFrame(data1, columns=["value", "date"])


data2 = [
    ["unique_row","a", datetime(2022, 11, 26),datetime(2022, 11, 27)],
    ["unique_row","b", datetime(2022, 11, 27),datetime(2022, 11, 30)],
    ["unique_row","c", datetime(2022, 11, 30),datetime(2022, 12, 2)],
]
df2 = pd.DataFrame(data2, columns=["unique_row","value", "dates_begin","date_end"])


fig1= px.line(df1, x="date", y="value")
fig2 = px.timeline(df2, x_start="dates_begin", x_end="date_end", y="unique_row", color="value")

fig_sub = sp.make_subplots(rows=2, 
                          shared_xaxes=True)

fig_sub.append_trace(fig1['data'][0], row=1, col=1)
fig_sub.append_trace(fig2['data'][0], row=2, col=1)

fig_sub.update_layout(xaxis2_rangeslider_visible=True)

要实现Range Slider仅显示在第二行子图下方且无重复布局，可通过以下调整：

• 将子图的shared_xaxes参数设为'columns'，确保x轴联动的同时控制布局逻辑；
• 隐藏第一行子图的x轴刻度，避免重复显示；
• 直接为第二行的x轴启用Range Slider，而非通过update_layout设置。

修改后的完整代码：

import pandas as pd
import plotly.express as px
import plotly.subplots as sp
from datetime import datetime


data1 = [
    [1, datetime(2022, 11, 26)],
    [7, datetime(2022, 11, 29)],
    [4, datetime(2022, 11, 30)],
]
df1 = pd.DataFrame(data1, columns=["value", "date"])


data2 = [
    ["unique_row","a", datetime(2022, 11, 26),datetime(2022, 11, 27)],
    ["unique_row","b", datetime(2022, 11, 27),datetime(2022, 11, 30)],
    ["unique_row","c", datetime(2022, 11, 30),datetime(2022, 12, 2)],
]
df2 = pd.DataFrame(data2, columns=["unique_row","value", "dates_begin","date_end"])


fig1= px.line(df1, x="date", y="value")
fig2 = px.timeline(df2, x_start="dates_begin", x_end="date_end", y="unique_row", color="value")

# 使用columns级别的x轴共享，替代原有的shared_xaxes=True
fig_sub = sp.make_subplots(rows=2, cols=1, shared_xaxes='columns')

fig_sub.append_trace(fig1['data'][0], row=1, col=1)
fig_sub.append_trace(fig2['data'][0], row=2, col=1)

# 隐藏第一行的x轴刻度，避免与第二行重复
fig_sub.update_xaxes(visible=False, row=1, col=1)
# 为第二行x轴单独启用Range Slider
fig_sub.update_xaxes(rangeslider_visible=True, row=2, col=1)

# 可选：调整布局高度和图例显示，优化视觉效果
fig_sub.update_layout(height=600, showlegend=False)

fig_sub.show()

关键调整说明 #

1. shared_xaxes='columns'：让两行子图的x轴保持联动，同时指定第二行的x轴作为底部的主显示轴，避免布局混乱；
2. 隐藏第一行x轴：通过visible=False移除第一行的x轴刻度，确保只有第二行的x轴和Range Slider显示在底部；
3. 直接为第二行x轴设置Range Slider：使用update_xaxes针对第二行的x轴单独启用Range Slider，比通过update_layout设置更精准，不会触发重复行的问题。

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