使用清单在 Plotly 中动态添加跟踪

Question

我有一个包含不同年龄范围的数据集作为不同的列。我正在尝试为 Plotly 中的每个年龄段创建动态轨迹，以创建比较条形图。此外，我希望将这些轨迹连接到一个清单，这样我就可以选择在结果图中显示哪个 traces/bars。但是，我无法弄清楚如何将此清单连接到图中的结果轨迹，特别是因为我还有其他下拉列表也连接到此图。这是代码示例

    Gender=xl['Gender'].unique()
    Age=xl['Age'].unique()
    Activity=xl['Sport'].unique()

app=dash.Dash(__name__)

app.layout=html.Div(children=
[html.Div([
    html.H3('Age:', style={'paddingRight': '30px','fontSize':18}),

    dcc.Checklist(
        id='Age',
        options=[
            {'label': i, 'value': i} for i in Age],
    value='18-24' 
)], style={'width':'33%','display':'inline-block'}),

html.Div([
    html.H3('Gender:', style={'paddingRight': '30px','fontSize':18}),
    dcc.Dropdown(
        id='Gender', 
        options=[
            {'label': 'Male', 'value': 'Male'},
            {'label': 'Female', 'value': 'Female'}
        ],
        value='Male'
    )], style={'width':'33%','display':'inline-block'}),

html.H3('Activity:', style={'paddingRight': '30px','fontSize':18}), 

dcc.Dropdown(
id='Sport',
options=[
{'label': i, 'value': i} for i in Activity],
value='Yoga'
),
],style={'width':'33%','display':'inline-block'}),

html.Div([
    dcc.Graph(id='linear')]),

html.Div([
    dcc.Graph(id='linear2')
])])

@app.callback(
 dash.dependencies.Output('linear','figure'),
[dash.dependencies.Input('Gender','value'),
 dash.dependencies.Input('Sport','value'),
 dash.dependencies.Input('Age','value')])

def update_graph(Gender_name,sport_name,age_name):
      xl1=xl[xl['Gender'] == Gender_name]
      xl2=xl1[xl1['Sport'] == sport_name]
      xl3=xl2[xl2['Age'] == age_name]

      Total_x=xl3.Date

      trace1=go.Bar(x=Total_x,y=age_name?,name='6-12')
      trace2=go.Bar(x=Total_x,y=age_name?,name='12-18')
      trace3=go.Bar(x=Total_x,y=age_name,name='18-24')

      Totallayout=go.Layout(xaxis={'title': 'Year'},
                              yaxis={'title': 'Participants'},
                              title= 'Core Player Comparison',
                              hovermode='closest')


      return {'data':[trace2,trace1,trace3],
             'layout':[Totallayout]}

我希望有人可以帮助我使用 def 更新图形功能，以便它可以 link 回到我在创建不同轨迹时创建的年龄下拉列表。如果有人能提供帮助，那将不胜感激，谢谢！

示例数据框：

日期运动性别年龄球员核心
2008 瑜伽男 6-12 2308.54 692.562
2008 瑜伽男 13-17 3551.60 1065.480
2008 瑜伽男 18-24 2663.70 799.110
2008 瑜伽男 25-34 3551.60 1065.480
2008 瑜伽男 35-44 2130.96 639.288

想法是创建一个图表，其中 "Players" 或 "Core" 是 Y 轴，日期是 x 轴，年龄是轨迹。

Answer 1

感谢您更新样本df。我不确定您的目标是什么，但我有数据流过并绘制了 df 图表。这是一个功能示例：

dict_form = {
    'Date': [2008, 2008, 2008, 2008, 2008],
    'Sport': ['Yoga', 'Yoga', 'Yoga', 'Yoga', 'Yoga'],
    'Gender': ['Male', 'Male', 'Male', 'Male', 'Male'],
    'Age': ['6-12', '13-17', '18-24', '25-34', '35-44'],
    'Players': [2308.54, 3551.60, 2663.70, 3551.60, 2130.96],
    'Core': [692.562, 1065.480, 799.110, 1065.480, 639.288],
}

df = pandas.DataFrame.from_dict(dict_form)

app = dash.Dash(__name__)

app.layout = html.Div(children=[
    html.Div(children=[
        html.H3('Age:', style={'paddingRight': '30px', 'fontSize': 18}),

        dcc.Checklist(
            id='Age',
            options=[
                {'label': i, 'value': i} for i in df['Age']],
            values=['18-24']
            )
    ]),

    html.Div(children=[
        html.H3('Gender:', style={'paddingRight': '30px', 'fontSize': 18}),
        dcc.Dropdown(
            id='Gender',
            options=[
                {'label': 'Male', 'value': 'Male'},
                {'label': 'Female', 'value': 'Female'}
            ],
            value='Male'
        )
    ], style={'width': '33%', 'display': 'inline-block'}),

    html.H3('Activity:', style={'paddingRight': '30px', 'fontSize': 18}),
    dcc.Dropdown(
        id='Sport',
        options=[
            {'label': i, 'value': i} for i in df['Sport']],
        value='Yoga'
    ),

    html.Div([
        dcc.Graph(id='linear')]),

    html.Div([
        dcc.Graph(id='linear2')
    ])
], style={'width': '33%', 'display': 'inline-block'})


@app.callback(
    dash.dependencies.Output('linear', 'figure'),
    [dash.dependencies.Input('Gender', 'value'),
     dash.dependencies.Input('Sport', 'value'),
     dash.dependencies.Input('Age', 'values')])
def update_graph(gender_name, sport_name, age_name):
    df1 = df[df['Gender'] == gender_name]
    df2 = df1[df1['Sport'] == sport_name]
    df3 = df2[df2['Age'].isin(age_name)]

    total_x = df3.Age

    trace1 = go.Bar(x=total_x, y=df3['Players'], name='Players')
    trace2 = go.Bar(x=total_x, y=df3['Core'], name='Core')

    total_layout = go.Layout(xaxis={'title': 'Year'},
                             yaxis={'title': 'Participants'},
                             title='Core Player Comparison',
                             hovermode='closest')

    return {'data': [trace2, trace1],
            'layout': [total_layout]}


if __name__ == '__main__':
    app.run_server(debug=True, threaded=True)

这是图表的屏幕截图：

使用清单在 Plotly 中动态添加跟踪

Dynamically Adding Traces In Plotly With A Checklist

python

plotly

plotly-dash