基于Dash/Jupyter Dash实现带筛选的Plotly Treemap及悬停自定义

以下是完整的可运行代码，基于经典的tips数据集实现你的需求：

# 导入依赖库
import dash
from dash import dcc, html, Input, Output
import plotly.express as px
from jupyter_dash import JupyterDash  # 仅Jupyter环境需要，普通Dash可替换为dash.Dash()

# 加载示例数据集（你可以替换成自己的数据集）
df = px.data.tips()

# 初始化应用
app = JupyterDash(__name__)  # 普通Dash环境改为：app = dash.Dash(__name__)

# 构建应用布局
app.layout = html.Div([
    # 下拉选择框：按smoker字段筛选
    html.Div([
        html.Label("筛选吸烟者/非吸烟者："),
        dcc.Dropdown(
            id='smoker-filter',
            options=[
                {'label': '所有用户', 'value': 'All'},
                {'label': '吸烟者', 'value': 'Yes'},
                {'label': '非吸烟者', 'value': 'No'}
            ],
            value='All',  # 默认显示所有数据
            clearable=False
        )
    ], style={'width': '30%', 'margin': '20px'}),
    
    # 显示Treemap的图形组件
    dcc.Graph(id='treemap-output')
])

# 回调函数：根据筛选条件更新Treemap
@app.callback(
    Output('treemap-output', 'figure'),
    Input('smoker-filter', 'value')
)
def update_treemap(selected_smoker):
    # 数据筛选逻辑
    if selected_smoker != 'All':
        filtered_df = df[df['smoker'] == selected_smoker]
    else:
        filtered_df = df
    
    # 生成自定义悬停的Treemap
    fig = px.treemap(
        filtered_df,
        path=['sex', 'day', 'time'],  # 可根据你的需求调整层级
        values='total_bill',  # 用于划分区块大小的数值字段
        # 自定义悬停数据：计算每个分组的total_bill平均值和最小值
        hover_data={
            'total_bill': False,  # 隐藏默认的总和
            'avg_total_bill': lambda x: round(x.mean(), 2),
            'min_total_bill': lambda x: round(x.min(), 2)
        },
        title=f'Total Bill Treemap - {"所有用户" if selected_smoker == "All" else "吸烟者" if selected_smoker == "Yes" else "非吸烟者"}'
    )
    
    # 调整悬停框的显示格式（可选）
    fig.update_traces(
        hovertemplate='<b>%{label}</b><br>' +
                      '平均账单: $%{customdata[0]}<br>' +
                      '最低账单: $%{customdata[1]}<br>' +
                      '区块占比: %{percentParent:.1%}'
    )
    
    return fig

# 运行应用
if __name__ == '__main__':
    app.run_server(mode='inline')  # Jupyter环境用mode='inline'，普通Dash用app.run_server(debug=True)

关键部分说明： #

1. 下拉筛选逻辑：

   • 下拉框提供三个选项：所有用户、吸烟者、非吸烟者，通过回调接收选中值后过滤数据集。
   • 若选中All，则使用完整数据集，否则筛选出对应smoker字段的记录。

2. 自定义悬停数据：

   • 通过hover_data参数，用lambda函数计算每个分组的total_bill平均值和最小值，同时设置'total_bill': False隐藏默认的总和。
   • 用update_traces自定义悬停模板（hovertemplate），让显示更清晰友好，customdata对应hover_data中自定义字段的顺序。

3. 环境适配：

   • 如果是在Jupyter Notebook/Lab中运行，使用JupyterDash并设置mode='inline'；普通Python环境直接替换为dash.Dash()并运行app.run_server(debug=True)。

你可以根据自己的数据集调整path参数（Treemap的层级字段）、数值字段等，代码结构完全通用。

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